Оптимизация компонентов (уменьшение) для повышения производительности

Повысьте производительность компонентов и уменьшите размер выгружаемых файлов, оптимизировав код JavaScript с помощью Developer Cloud Service.

Оптимизация компонентов

Пример оптимизации исходного кода компонента (дополнительно) представлен для компонента Sample-Text-With-Image. Для уменьшения и объединения исходного кода можно использовать оптимизатор RequireJS. При уменьшении компонента удаляются ненужные пробелы в коде JavaScript, что повышает производительность и уменьшает размер выгружаемых файлов. Оптимизация включает в себя следующие действия:

  • Уменьшение кода JavaScript.

  • Сжатие CSS.

  • Объединение кода JavaScript, HTML и CSS в один файл render.js.

Эта оптимизация сокращает размер выгружаемых файлов и повышает производительность.

Включение оптимизации для компонента

В компоненте Sample-Text-With-Image оптимизация уменьшает и объединяет все файлы, отмеченные как зависимые ресурсы в файле render.js (template.html, data-defaults.js и design.css) в файл render.js. Другие компоненты, которые уже поддерживают оптимизацию:

  • Sample-Folder-List

  • Sample-File-List

  • Sample-Documents-Manager

  • Sample-Process-Start-Form

  • Sample-Process-Task-List

  • Sample-Process-Task-Details

Чтобы включить оптимизацию для локального компонента, выполните указанные ниже действия (обязательные).

  1. Скопируйте файл gulpfile.js из компонента Sample-Text-With-Image в свой компонент.

  2. Исправьте имена модулей в файле gulpfile.js для зависимых ресурсов, указанных в файле render.js. См. комментарии в файле gulpfile.js.

Примечание.:

Если есть компонент с подпапкой css папки assets, переименуйте папку css в styles, чтобы избежать ошибок во время оптимизации.