Otimizar Componentes (Minificar) para Melhorar o Desempenho

Melhore o desempenho dos seus componentes e reduza o tamanho do descarregamento ao minificar o código JavaScript com o Developer Cloud Service.

Otimizar os Seus Componentes

É fornecido um exemplo de otimização do código-fonte do componente (opcional) para o componente Sample-Text-With-Image. Pode utilizar o otimizador do RequireJS para minificar e combinar código-fonte. A minificação de um componente retira espaço não pretendido no código JavaScript, resultando num melhor desempenho e na redução do tamanho do descarregamento. A otimização envolve as seguintes ações:

  • Minificar o JavaScript.

  • Comprimir o CSS.

  • Combinar o JavaScript, HTML e CSS num único ficheiro, render.js.

Esta otimização reduz o tamanho do descarregamento e melhora o desempenho.

Ativar a Otimização para o Seu Componente

No componente Sample-Text-With-Image, a otimização irá minificar e combinar todos os ficheiros que estão marcados como dependências no render.js (template.html, data-defaults.js e design.css) para o render.js como um único ficheiro. Seguem-se outros componentes que já suportam a otimização: 

  • Sample-Folder-List

  • Sample-File-List

  • Sample-Documents-Manager

  • Sample-Process-Start-Form

  • Sample-Process-Task-List

  • Sample-Process-Task-Details

Para ativar a otimização para o seu componente local, execute os passos seguintes (obrigatórios):

  1. Copie o gulpfile.js do componente Sample-Text-With-Image para o seu componente.

  2. Corrija os nomes dos módulos no gulpfile.js para as suas dependências do render.js. Consulte os comentários no gulpfile.js.

Nota:

Se tiver um componente com uma pasta css em assets, renomeie a pasta css para styles de modo a evitar erros durante a otimização.