Voit parantaa komponenttien suorituskykyä ja pienentää noudettavien tiedostojen kokoa tiivistämällä JavaScript-koodin Developer Cloud Service -palvelun avulla.
Komponenttien optimointi
Alla on esimerkki komponentin lähdekoodin optimoinnista (valinnainen) Sample-Text-With-Image
-komponentille. Voit käyttää RequireJS-optimoijaa lähdekoodin tiivistykseen ja yhdistämiseen. Komponentin tiivistyksessä JavaScript-koodista poistetaan tarpeettomat välilyönnit, jotta suorituskyky olisi parempi ja noudettavan tiedoston koko pienempi. Optimointiin kuuluvat seuraavat toimet:
JavaScriptin tiivistys
CSS-koodin pakkaus
JavaScript-, HTML- ja CSS-tiedostojen yhdistäminen yhdeksi tiedostoksi nimeltä render.js
.
Tämä optimointi pienentää noudettavan tiedoston kokoa ja parantaa suorituskykyä.
Optimoinnin käyttöönotto komponentille
Sample-Text-With-Image
-komponentissa optimointi tiivistää ja yhdistää kaikki tiedostot, jotka on merkitty riippuvuuksiksi render.js
-tiedostossa (template.html
, data-defaults.js
ja design.css
) yksittäiseksi render.js
-tiedostoksi. Muut komponentit, jotka tukevat jo optimointia:
Sample-Folder-List
Sample-File-List
Sample-Documents-Manager
Sample-Process-Start-Form
Sample-Process-Task-List
Sample-Process-Task-Details
Voit ottaa optimoinnin käyttöön paikalliselle komponentille tekemällä seuraavat toimet (pakollinen):
Kopioi gulpfile.js
-tiedosto Sample-Text-With-Image
-komponentista omaan komponenttiisi.
Korjaa gulpfile.js
-tiedoston moduulien nimet vastaamaan oman render.js
-tiedostosi riippuvuuksia. Katso lisätietoja gulpfile.js
-tiedoston kommenteista.
Huomautus::
Jos olemassa oleva komponentti sisältääcss
-kansion assets
-kansiossa, vaihda css
-kansion nimeksi styles
, jotta optimoinnin aikana ei esiintyisi virheitä.