cookiesjsr icon indicating copy to clipboard operation
cookiesjsr copied to clipboard

Google Pagespeed optimization

Open JPustkuchen opened this issue 3 years ago • 3 comments

Using cookiesjsr (by the Drupal Cookies module), Google Pagespeed complains the following:

https://pagespeed.web.dev/

Verhindern, dass in modernen Browsern veraltetes JavaScript bereitgestellt wird 0,15 s Dank Polyfills und "transform" können veraltete Browser die neuen JavaScript-Funktionen nutzen. Bei modernen Browsern hingegen sind viele davon nicht erforderlich. Für Ihr JavaScript-Bundle sollten Sie eine moderne Skriptimplementierungsstrategie unter Verwendung der module/nomodule-Funktionserkennung einsetzen. So können Sie einerseits den an moderne Browser übermittelten Code auf das Nötige reduzieren und gleichzeitig veraltete Browser bestmöglich unterstützen. Weitere InformationenTBT URL

Mögliche Einsparungen …dist/cookiesjsr.min.js?v=1.0.12(www.example.com)

20,6 KiB …dist/cookiesjsr.min.js?v=1.0.12:11:3290(www.example.com)

@babel/plugin-transform-classes

…dist/cookiesjsr.min.js?v=1.0.12:11:55713(www.example.com)

Object.getOwnPropertyNames

…dist/cookiesjsr.min.js?v=1.0.12:11:59669(www.example.com)

Array.from

…dist/cookiesjsr.min.js?v=1.0.12:11:95658(www.example.com)

Array.prototype.fill

…dist/cookiesjsr.min.js?v=1.0.12:11:95806(www.example.com)

Array.prototype.filter

…dist/cookiesjsr.min.js?v=1.0.12:11:96060(www.example.com)

Array.prototype.find

…dist/cookiesjsr.min.js?v=1.0.12:11:96341(www.example.com)

Array.prototype.findIndex

…dist/cookiesjsr.min.js?v=1.0.12:11:97034(www.example.com)

Array.prototype.forEach

…dist/cookiesjsr.min.js?v=1.0.12:11:97162(www.example.com)

Array.prototype.includes

…dist/cookiesjsr.min.js?v=1.0.12:11:98051(www.example.com)

Array.prototype.map

…dist/cookiesjsr.min.js?v=1.0.12:11:98573(www.example.com)

Array.prototype.reduce

…dist/cookiesjsr.min.js?v=1.0.12:11:98821(www.example.com)

Array.prototype.reduceRight

…dist/cookiesjsr.min.js?v=1.0.12:11:99857(www.example.com)

Array.prototype.some

…dist/cookiesjsr.min.js?v=1.0.12:11:107717(www.example.com)

Number.isInteger

…dist/cookiesjsr.min.js?v=1.0.12:11:107895(www.example.com)

Number.isSafeInteger

…dist/cookiesjsr.min.js?v=1.0.12:11:108306(www.example.com)

Number.parseInt

…dist/cookiesjsr.min.js?v=1.0.12:11:110363(www.example.com)

Object.entries

…dist/cookiesjsr.min.js?v=1.0.12:11:110510(www.example.com)

Object.freeze

…dist/cookiesjsr.min.js?v=1.0.12:11:111042(www.example.com)

Object.getOwnPropertyDescriptors

…dist/cookiesjsr.min.js?v=1.0.12:11:111439(www.example.com)

Object.getPrototypeOf

…dist/cookiesjsr.min.js?v=1.0.12:11:111675(www.example.com)

Object.isExtensible

…dist/cookiesjsr.min.js?v=1.0.12:11:111846(www.example.com)

Object.isFrozen

…dist/cookiesjsr.min.js?v=1.0.12:11:112011(www.example.com)

Object.isSealed

…dist/cookiesjsr.min.js?v=1.0.12:11:112160(www.example.com)

Object.keys

…dist/cookiesjsr.min.js?v=1.0.12:11:112814(www.example.com)

Object.preventExtensions

…dist/cookiesjsr.min.js?v=1.0.12:11:113019(www.example.com)

Object.seal

…dist/cookiesjsr.min.js?v=1.0.12:11:113150(www.example.com)

Object.setPrototypeOf

…dist/cookiesjsr.min.js?v=1.0.12:11:113246(www.example.com)

Object.values

…dist/cookiesjsr.min.js?v=1.0.12:11:118400(www.example.com)

Reflect.apply

…dist/cookiesjsr.min.js?v=1.0.12:11:118771(www.example.com)

Reflect.construct

…dist/cookiesjsr.min.js?v=1.0.12:11:119744(www.example.com)

Reflect.defineProperty

…dist/cookiesjsr.min.js?v=1.0.12:11:120012(www.example.com)

Reflect.deleteProperty

…dist/cookiesjsr.min.js?v=1.0.12:11:120197(www.example.com)

Reflect.get

…dist/cookiesjsr.min.js?v=1.0.12:11:120461(www.example.com)

Reflect.getOwnPropertyDescriptor

…dist/cookiesjsr.min.js?v=1.0.12:11:120603(www.example.com)

Reflect.getPrototypeOf

…dist/cookiesjsr.min.js?v=1.0.12:11:120711(www.example.com)

Reflect.has

…dist/cookiesjsr.min.js?v=1.0.12:11:120833(www.example.com)

Reflect.isExtensible

…dist/cookiesjsr.min.js?v=1.0.12:11:120932(www.example.com)

Reflect.ownKeys

…dist/cookiesjsr.min.js?v=1.0.12:11:121021(www.example.com)

Reflect.preventExtensions

…dist/cookiesjsr.min.js?v=1.0.12:11:121783(www.example.com)

Reflect.setPrototypeOf

…dist/cookiesjsr.min.js?v=1.0.12:11:123436(www.example.com)

String.prototype.codePointAt

…dist/cookiesjsr.min.js?v=1.0.12:11:124047(www.example.com)

String.fromCodePoint

…dist/cookiesjsr.min.js?v=1.0.12:11:125456(www.example.com)

String.raw

…dist/cookiesjsr.min.js?v=1.0.12:11:125665(www.example.com)

String.prototype.repeat

…js/js_Be3uUI….js(www.example.com)

5,2 KiB …js/js_Be3uUI….js:439:212(www.example.com)

Date.now

…js/js_Be3uUI….js:440:6683(www.example.com)

@babel/plugin-transform-classes

…dist/cookiesjsr-preloader.min.js?v=9.3.2(www.example.com)

0,0 KiB …dist/cookiesjsr-preloader.min.js?v=9.3.2:1:29424(www.example.com)

@babel/plugin-transform-classes

JPustkuchen avatar Jan 14 '22 13:01 JPustkuchen

Once again I can confirm this in a further project. Just check a project using cookiesjsr with https://pagespeed.web.dev/report?

https://philipwalton.com/articles/deploying-es2015-code-in-production-today/

JPustkuchen avatar Sep 23 '22 09:09 JPustkuchen

Yes, updating the old JS is sorely needed.

vredeling avatar Oct 03 '22 20:10 vredeling

Yes, this is also confirmed by Google Lighthouse:

Avoid serving legacy JavaScript to modern browsers Potential savings of 13 KiB

Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren't necessary for modern browsers. For your bundled JavaScript, adopt a modern script deployment strategy using module/nomodule feature detection to reduce the amount of code shipped to modern browsers, while retaining support for legacy browsers.

This library's successor https://github.com/jfeltkamp/cookiesjsr-vue, might've already fixed that, but unfortunately it isn't production ready yet.

joshsedl avatar May 15 '24 09:05 joshsedl