search

jfeltkamp / cookiesjsr

Easily expandable cookie consent tool.
Other
22 stars 5 forks source link

Google Pagespeed optimization #11

Open JPustkuchen opened 2 years ago

JPustkuchen commented 2 years ago

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 commented 1 year ago

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/

vredeling commented 1 year ago

Yes, updating the old JS is sorely needed.

joshsedl commented 1 month ago

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.