plotly / plotly/react-plotly.js

Javascript runs out of memory when making production build

Đang mở
#130 5 bình luận 2 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Ngôn ngữ chính
JavaScript
Star
1.1k
Fork
138
Merge trung bình
3 ngày 2 giờ
Pull request đã merge (30 ngày)
4

Mô tả

When I try to build a prod version of my create-react-app using npm run build, I get the following error:

<--- Last few GCs --->

[7898:0x104800000]    66632 ms: Mark-sweep 1329.1 (1449.4) -> 1317.7 (1451.4) MB, 564.0 / 
0.0 ms  (average mu = 0.110, current mu = 0.031) allocation failure scavenge might not succeed
[7898:0x104800000]    67209 ms: Mark-sweep 1331.4 (1451.4) -> 1320.0 (1453.9) MB, 559.9 / 
0.0 ms  (average mu = 0.072, current mu = 0.030) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

0: ExitFrame [pc: 0x1c05060cfc7d]
1: StubFrame [pc: 0x1c05060c8bd9] 
Security context: 0x298c12a1d949 <JSObject>
2: split [0x298c12a0f5c9](this=0x298c12a22391 <String[1]: 4>,0x298c508c3b91 <JSRegExp 
<String[5]: \r?\n>>)
3: I [0x298cef46c9f1] [/Users/arshpreetsinghbhatti/Desktop/portal- 
ui/node_modules/terser/dist/bundle.js:~44] [pc=0x1c050616d8f8](this=0x298cef46ca71 <Object 
map = 0x298c72bc68b1>,0x298c12a22391 <String[1]: 4...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out 
of memory

Writing Node.js report to file: report.20190304.101657.7898.001.json
Node.js report completed
 1: 0x10006313d node::Abort() [/usr/local/bin/node]
 2: 0x100063894 node::OnFatalError(char const*, char const*) [/usr/local/bin/node]
 3: 0x1001a5ca7 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) 
[/usr/local/bin/node]
 4: 0x1001a5c44 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, 
bool) [/usr/local/bin/node]
5: 0x1005aada2 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]
6: 0x1005ad2d3 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) 
[/usr/local/bin/node]
 7: 0x1005a9808 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, 
v8::GCCallbackFlags) [/usr/local/bin/node]
 8: 0x1005a79c5 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, 
v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
 9: 0x1005b426c v8::internal::Heap::AllocateRawWithLightRetry(int, v8::internal::AllocationSpace, 
v8::internal::AllocationAlignment) [/usr/local/bin/node]
10: 0x1005b42ef v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, 
v8::internal::AllocationAlignment) [/usr/local/bin/node]
11: 0x1005834e4 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) 
[/usr/local/bin/node]
12: 0x100835a04 v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, 
v8::internal::Isolate*) [/usr/local/bin/node]
13: 0x1c05060cfc7d

I tried to use the workaround suggested in https://github.com/plotly/react-plotly.js/issues/26#issuecomment-359925194

I inserted the preset in webpack.config.prod file, with
{ test: /\.js$/, use: 'ify-loader', }, { test: /\.js$/, use: 'transform-loader?plotly.js/tasks/compress_attributes.js', },

But it still runs out of memory when I do npm run build

Here's a sandbox for reference: https://codesandbox.io/s/381yjyn415

I've taken the liberty of adding all the dependencies that I use in my project.

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với webpack.config.prod và tái hiện lỗi bằng npm run build cùng CodeSandbox được liên kết; kiểm tra mục terser trong stack trace được báo cáo cùng với các rule ify-loader và transform-loader đã thêm. Công việc được xem là hoàn tất khi bản build production hoàn thành mà không gặp lỗi JavaScript heap out-of-memory đối với setup đã báo cáo.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
javascript, react, webpack
Lĩnh vực
build-system, frontend
Loại issue
Lỗi
Độ khó
4/5
Thời gian dự kiến
3-5 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Cần làm rõ
Mức phù hợp với người mới
35/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.