Optimizar componentes (minificar) para mejorar el rendimiento

Mejore el rendimiento de los componentes y reduzca los tamaños de descarga minimizando el código JavaScript con Developer Cloud Service.

Optimización de los componentes

Se proporciona un ejemplo de optimización del código fuente de los componentes (opcional) para el componente Sample-Text-With-Image. Puede utilizar el optimizador RequireJS para minificar y combinar el código fuente. La minificación de un componente elimina el espacio no deseado en el código JavaScript, dando como resultado un mejor rendimiento y la reducción del tamaño de descarga. La optimización implica las siguientes acciones:

  • Minificar JavaScript.

  • Comprimir el CSS.

  • Combinar el JavaScript, el HTML y el CSS en un único archivo, render.js.

Esta optimización reduce el tamaño de descarga y mejora el rendimiento.

Activación de la optimización para el componente

En el componente Sample-Text-With-Image, la optimización minificará y combinará todos los archivos marcados como dependencias en render.js (template.html, data-defaults.js y design.css) en render.js como un único archivo. A continuación se enumeran otros componentes que ya admiten la optimización: 

  • Sample-Folder-List

  • Sample-File-List

  • Sample-Documents-Manager

  • Sample-Process-Start-Form

  • Sample-Process-Task-List

  • Sample-Process-Task-Details

Para activar la optimización del componente local, siga los pasos (obligatorios) que se indican a continuación:

  1. Copie gulpfile.js desde el componente Sample-Text-With-Image a su componente.

  2. Corrija los nombres de módulo en gulpfile.js para las dependencias de render.js. Consulte los comentarios en gulpfile.js.

Nota:

Si tiene un componente existente con una carpeta css en assets, renombre la carpeta css a styles para evitar errores durante la optimización.