Optimera komponenter (Minify) för bättre prestanda

Förbättra komponenternas prestanda och minska nedladdningsstorlekarna genom att minimera JavaScript-koden med molntjänsten för utvecklingsverktyg.

Optimera komponenterna

Ett exempel på optimering av komponentkällkod (valfri) tillhandahålls för komponenten Sample-Text-With-Image. Du kan använda RequireJS-optimeraren för att minimera och kombinera källkod. Minimering av en komponent tar bort oönskade blanksteg i JavaScript-koden, vilket leder till bättre prestanda och minskad nedladdningsstorlek. Optimering involverar följande åtgärder:

  • Minimera JavaScript.

  • Komprimera CSS.

  • Kombinera JavaScript, HTML och CSS till en enda fil, render.js.

Den här optimeringen minskar nedladdningsstorleken och förbättrar prestanda.

Aktivera optimering för komponenten

I komponenten Sample-Text-With-Image minimerar och kombinerar optimering alla filer som är märkta som beroenden i render.js (template.html, data-defaults.js och design.css) i render.js som en enda fil. Andra komponenter som redan stöder optimering är följande:

  • Sample-Folder-List

  • Sample-File-List

  • Sample-Documents-Manager

  • Sample-Process-Start-Form

  • Sample-Process-Task-List

  • Sample-Process-Task-Details

Du aktiverar optimering för den lokala komponenten genom att utföra följande steg (krävs):

  1. Kopiera gulpfile.js från komponenten Sample-Text-With-Image till din komponent.

  2. Åtgärda modulnamnen i gulpfile.js för dina render.js-beroenden. Se kommentarerna i gulpfile.js.

Obs!:

Om du har en befintlig komponent, med en css-mapp under assets, ändrar du namn på css-mappen till styles för att undvika fel under optimeringen.