Ember.js: V3.17.0 में एसेट आकार प्रतिगमन

एक नए नए एम्बर प्रोजेक्ट में पुष्टि कर सकते हैं:

__2.16.0__

• विक्रेता: 692.58 KB (176.09 KB gzipped)
• ऐप: 9.82 KB (2.15 KB gzipped)

__2.17.0__

• विक्रेता: 715.12 KB (183.64 KB gzipped)
• एप्लिकेशन: 9.94 KB (2.2 KB gzipped)

क्या कुछ वेंडर अलग हुए और यह कुछ ग्लिमर-वीएम अपडेट्स के कारण लगता है, जैसे https://github.com/glimmerjs/glimmer-vm/commit/4c56c216465410f5bf6f53fb7d4508f8048f09#diff -64c3cff3cf6c6 /16 ember.js / प्रतिबद्ध / 699439c0aaa1917754490efeb5751d10f77e5230

मुझे भी।

2.16.3

• विक्रेता: 886KB (213KB ब्रेटली)
• ऐप: 1.01MB (126KB ब्रेटली)

2.17.0

• विक्रेता: 907KB (219KB ब्रेटली)
• ऐप: 1.15MB (137KB ब्रेटली)

इसके अलावा, मैंने 2.16.3 से 2.17.0 तक हमारे एकीकरण परीक्षणों में एक ~ 5% प्रदर्शन में गिरावट देखी।

PS @ Turbo87 - क्या यह एचबीएस मिनिफ़ायर के कारण हो सकता है? मैं भी इसका उपयोग कर रहा हूं। क्या यह अपडेटेड ग्लिमर वीएम द्वारा उत्पन्न नए टेम्प्लेट के लिए किसी तरह "टूट" सकता है?

@ बोरिस-पेट्रोव - मन की जाँच हमारे लिए? मुझे लगता है कि आपको अपने ऐप्स से मिनिफ़र को package.json निकालने में सक्षम होना चाहिए ...

ऐसा लगता है कि यह ग्लिमर वायरफॉर्म में बदलाव से आ रहा है, जो टेम्प्लेट के आकार को थोड़ा बढ़ा रहा है। विशेष रूप से ऐप पर एक बदलाव करने के लिए https://github.com/glimmerjs/glimmer-vm/blob/11cc83b2adf220bef298a1a6298c9e4e750c9b1/packages/%40glimmer/interfaces/lib/compile/wireat-.dat###

@rwjblue - मेरा मानना ​​है कि @krisselden सही है - इसका ember-hbs-minifier से कोई लेना-देना नहीं है। मैंने निम्न सहायक के साथ एक बिल्कुल नया एम्बर ऐप आज़माया:

import Helper from '@ember/component/helper';
export default Helper.helper(() => true);

और दो घटक:

other-component.hbs

{{some-component foo=1}}

some-component.hbs

{{some-helper 1 2 3 @foo}}

3.16.3 दो घटकों के लिए उत्पादित:

other-component.hbs :

block: "{\"symbols\":[],\"statements\":[[1,[28,\"some-component\",null,[[\"foo\"],[1]]],false],[0,\"\\n\"]],\"hasEval\":false}",

some-component.hbs :

block: "{\"symbols\":[\"@foo\"],\"statements\":[[1,[28,\"some-helper\",[1,2,3,[23,1,[]]],null],false],[0,\"\\n\"]],\"hasEval\":false}",

3.17 के लिए समान:

other-component.hbs :

block: "{\"symbols\":[],\"statements\":[[1,0,0,0,[31,2,14,[27,[26,0,\"CallHead\"],[]],null,[[\"foo\"],[1]]]],[1,1,0,0,\"\\n\"]],\"hasEval\":false,\"upvars\":[\"some-component\"]}",

some-component.hbs :

block: "{\"symbols\":[\"@foo\"],\"statements\":[[1,0,0,0,[31,2,11,[27,[26,0,\"CallHead\"],[]],[1,2,3,[27,[24,1],[]]],null]],[1,1,0,0,\"\\n\"]],\"hasEval\":false,\"upvars\":[\"some-helper\"]}",

मैं इसे "बग" नहीं कहूंगा, यह बहुत अच्छा नहीं है। आपके पास जितना बड़ा ऐप होगा, उतना बड़ा टेम्प्लेट मिल जाएगा।

वायर प्रारूप में परिवर्तन यहां किए गए कार्य से संबंधित प्रतीत होता है: https://github.com/glimmerjs/glimmer-vm/pull/972

https://github.com/glimmerjs/glimmer-vm/pull/1056

अंगार 3.16

- dist/assets/ember-observer.js: 706.89 KB (66.89 KB gzipped)

अंगार 3.17

 - dist/assets/ember-observer.js: 743.7 KB (69.63 KB gzipped)

कांस्टेबल एनम स्ट्रिंग के बाद नंबर

 - dist/assets/ember-observer.js: 739.58 KB (69.44 KB gzipped)

लोकल डेटा हटाना

 - dist/assets/ember-observer.js: 723.55 KB (68.06 KB gzipped)

चपटा हो जाओ + GetPath + GetContextualFree भाव

- dist/assets/ember-observer.js: 721.99 KB (68.04 KB gzipped)

मैंने एक उपयोग किया, यदि आप अपने ऐप्स पर चलने में कोई आपत्ति नहीं करेंगे, तो मुझे बताएंगे कि पैच कैसे होता है

https://www.npmjs.com/package/ember-template-size

$ npx ember-template-size .
npx: installed 11 in 1.766s
{
  '3.16.3': {
    version: '3.16.3',
    original: 793656,
    compiled: 1223295,
    brotli: 242598,
    gzip: 242606
  },
  '3.17.0-patched': {
    version: '3.17.0-patched',
    original: 793656,
    compiled: 1299096,
    brotli: 258803,
    gzip: 258826
  },
  '3.17.0': {
    version: '3.17.0',
    original: 793656,
    compiled: 1624741,
    brotli: 294760,
    gzip: 294780
  }
}

और https://github.com/rust-lang/crates.io के लिए :

{
  '3.16.3': {
    version: '3.16.3',
    original: 73613,
    compiled: 143264,
    brotli: 32477,
    gzip: 32608
  },
  '3.17.0-patched': {
    version: '3.17.0-patched',
    original: 73613,
    compiled: 160526,
    brotli: 34663,
    gzip: 34803
  },
  '3.17.0': {
    version: '3.17.0',
    original: 73613,
    compiled: 183711,
    brotli: 36903,
    gzip: 37070
  }
}

हमारे लिए:

{
  '3.16.3': {
    version: '3.16.3',
    original: 281240,
    compiled: 450040,
    brotli: 98120,
    gzip: 98142
  },
  '3.17.0-patched': {
    version: '3.17.0-patched',
    original: 281240,
    compiled: 494042,
    brotli: 105152,
    gzip: 105178
  },
  '3.17.0': {
    version: '3.17.0',
    original: 281240,
    compiled: 596287,
    brotli: 117757,
    gzip: 117784
  }
}

पैच सबसे कम लटकने वाले फल विचारों का प्रतिनिधित्व करता है जो मेरे पास था। मेरे पास कुछ और विचार हैं, लेकिन अब तक के परिणामों के आधार पर, बाकी प्रतिगमन को पुनर्प्राप्त करने के लिए नहीं जा रहा है। प्रतिगमन का कारण जो प्रतिगमन बड़ा था और कुछ भविष्य की दिशा को सक्षम करता है और मेरे पास सीमित समय है।

मेरे पास 2 और सरल विचार हैं, समतल करें [परिशिष्ट, 1 | 0, ...] में [TrustingAppend | परिशिष्ट, ..] और फिर तार प्रारूप टपल है जो बूलियन ध्वज का उपयोग करता है जो 1 का उपयोग कर सकता है 0 के बजाय।

FYI करें - https://github.com/emberjs/ember.js/pull/18941 विकास के थोक के पते को संबोधित करता है। 3.16 (हालांकि अभी भी ~ 3% से बड़ा है, जिस पर हम काम कर रहे हैं)।