Skriptien latauksien optimointeja

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 16:21

Nykyinen tilanne:

Tuosta näkyy, että Ace ladataan vahingossa suoraan. Se nyt ensimmäisenä täytyy korjata. Samaten momentin localeja ladataan aika paljon turhaan.

Eli kuvassa tuo main-es2015.hash.js-laatikko pitäisi saada mahdollisimman pieneksi.

[dezhidki]

In GitLab by @vesal on Feb 27, 2020, 16:32

Eli kuvassa tuo main-es2015.hash.js-laatikko pitäisi saada mahdollisimman pieneksi.

Eikö tuo oikea reuna ole ongelma?

Siellä on esim sagecell jota tarvitaan varmaan alle 1% sivuista?

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 16:35

Ei, koska kaikki nuo muut laatikot paitsi main-es2015 ladataan laiskasti vasta sitten, kun niitä ensimmäisen kerran sivulla tarvitaan.

[dezhidki]

In GitLab by @vesal on Feb 27, 2020, 16:36

Ei, koska kaikki nuo muut laatikot paitsi main-es2015 ladataan laiskasti vasta sitten, kun niitä ensimmäisen kerran sivulla tarvitaan.

Mikä noin hienon kuvan piirtää :-)

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 16:39

https://github.com/webpack-contrib/webpack-bundle-analyzer

Ja on vielä interaktiivinen kun se käynnistää tuon selaimeen :)

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 19:31

Korjattu Acen lataus ja karsittu Momentin localet. Nyt main-es2015:n koko pieneni 2.27 MB -> 1.55 MB.

[dezhidki]

In GitLab by @vesal on Feb 27, 2020, 22:56

https://github.com/webpack-contrib/webpack-bundle-analyzer

Ja on vielä interaktiivinen kun se käynnistää tuon selaimeen :)

Siis WIndows koneessa:

npm install --save-dev webpack-bundle-analyzer

Mihin tuo

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = { plugins: [ new BundleAnalyzerPlugin() ] }

laitetaan?

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 23:33

npm install --save-dev webpack-bundle-analyzer

Älä aja tuota, koska webpack-bundle-analyzer ei ole mikään pakollinen kirjasto ja se vaan turhaan kasvattaa noiden pakettien määrää package.json:ssa. Mieluummin globaaliksi:

npm install -g webpack-bundle-analyzer

Sitten aja timAppissa npm run bds ja sitten build-kansiossa on stats-tiedosto, jonka voi syöttää:

cd timApp\static\scripts\build
npx webpack-bundle-analyzer stats-es2015.json

[dezhidki]

In GitLab by @vesal on Feb 27, 2020, 23:37

Älä aja tuota, koska webpack-bundle-analyzer ei ole mikään pakollinen kirjasto ja se vaan turhaan kasvattaa noiden pakettien määrää package.json:ssa. Mieluummin globaaliksi:

No ehkä mulla ei tähän hätään ole aikaa leikkiä tuolla :-) Näytti kuitenkin ihan fiksulta.

Onkos tuo muutettu jo tuotannossa? Ainakin näytti että kun käynnistin editorin, niin silloin latasi lisää js:ää.

[dezhidki]

In GitLab by @Smibu on Feb 27, 2020, 23:38

Juu on tuotannossa jo.

[dezhidki]

In GitLab by @Smibu on Mar 4, 2020, 20:17

Nyt main-es2015:n koko pieneni 2.27 MB -> 1.55 MB.

Kappale-editori ladataan nyt laiskasti -> 1.49 MB.