Изменяющие правила игры веб-стандарты, производительность, сосуществование
Веб-компоненты Lightning - это новая модель программирования для создания компонентов Lightning. Он использует прорыв в области веб-стандартов за последние пять лет, может сосуществовать и взаимодействовать с исходной моделью программирования Aura и обеспечивает беспрецедентную производительность.
Веб-стек 2014 года
До недавнего времени веб-стандарты предлагали лишь ограниченную основу для полного стека, необходимого разработчикам для создания крупномасштабных веб-приложений: механизм визуализации, стандартные элементы, события и базовый язык (ECMAScript 5). Помимо того, что эта основа была рудиментарной, она имела и другие недостатки, которые можно проследить до ее корней как платформы рендеринга страниц, а не платформы выполнения приложений. Например:
- Рендеринг не был оптимизирован для непрерывного преобразования пользовательского интерфейса.
- Стандартных элементов пользовательского интерфейса было мало, и стандарт не поддерживал создание пользовательских элементов.
- В базовом языке отсутствовали современные конструкции для написания больших и модульных приложений корпоративного класса на стороне клиента (модули, классы, обещания, декораторы и т. Д.)
Распространение и фрагментация фреймворка
Как это часто бывает, сообщество и поставщики программного обеспечения вмешались, чтобы заполнить пробелы. Например:
- Различные библиотеки предоставляют разные языковые расширения для поддержки модульной и крупномасштабной разработки: модули (AMD и CommonJS), обещания, классы и другие общие утилиты.
- В разных фреймворках представлены разные компонентные модели и подходы к созданию HTML-шаблонов.
- Были разработаны новые методы оптимизации рендеринга (например, виртуальный DOM в React).
В 2014 году, когда мы запустили фреймворк Lightning Component вместе с моделью программирования Aura, мы были частью этих усилий по продвижению Интернета и обеспечению крупномасштабной разработки клиентских приложений в Интернете. В отсутствие стандартов инфраструктура компонентов Lightning поставлялась со своей собственной компонентной моделью и собственной модульной моделью программирования.
Хотя эти усилия сообщества и поставщиков программного обеспечения позволили разрабатывать крупномасштабные клиентские приложения на в Интернете они также столкнулись с рядом проблем:
- Фреймворки стали языком . React, Angular и Lightning Component Framework - все это фреймворки JavaScript, но они обеспечивают такой высокий уровень абстракции, что кажутся разными языками.
- В результате навыки не передавались, а разработчиков было трудно найти и наращивать.
- Приложения и компоненты, написанные на разных платформах, несовместимы.
Возрождение веб-стандартов
Эта фрагментация подчеркнула необходимость стандартизации и привела к новой жизни в сообществе веб-стандартов: за последние пять лет наблюдался беспрецедентный уровень инноваций и стандартизации, в основном за счет W3C / WHATWG и Технического комитета ECMAScript (TC39 ), Членом которой является Salesforce. В перечень стандартов, разработанных за последние пять лет, входят:
- ECMAScript 2015 (6), 2016 (7), 2017 (8), 2018 (9) и далее (добавление классов, модулей, обещаний, декораторов и т. Д.)
- Веб-компоненты
- Пользовательские элементы
- Шаблоны и слоты
- Теневой ДОМ
Интернет-стек 2019
В результате веб-стек сегодня выглядит совсем иначе, чем пять лет назад, и его вес теперь сильно смещается в сторону стандартов.
Наконец, основной стек получил необходимое обновление, чтобы стать самостоятельной платформой для разработки приложений. Многие функции, которые требовали фреймворков, теперь стали стандартными: вам больше не нужна проприетарная компонентная модель, расширения проприетарного языка, проприетарные модули и т. Д.
Больше стандартов, меньше рамок
Стандартизация основного стека невероятно увлекательна и открывает двери для нового поколения фреймворков: фреймворков, основная задача которых больше не заключается в заполнении пробелов в базовом стеке, а в предоставлении тонкого слоя специализированных сервисов поверх фреймворков. стандартный стек, который теперь подходит для крупномасштабной разработки приложений. Преимущества существенные:
- Модель общих компонентов
- Общая модель программирования
- Передаваемые навыки и разработчики, которых легче найти / легче наращивать
- Совместимые компоненты
- Лучшая производительность, поскольку основные функции встроены в веб-движки, а не в JavaScript в абстракциях фреймворка.
Знакомство с веб-компонентами Lightning
Lightning Web Components - это реализация Salesforce нового поколения облегченных фреймворков, построенных на веб-стандартах. Он использует пользовательские элементы, шаблоны, теневую модель DOM, декораторы, модули и другие новые языковые конструкции, доступные в ECMAScript 6 и более поздних версиях.
Веб-компоненты Lightning предоставляют уровень специализированных сервисов Salesforce поверх основного стека, в том числе:
- Базовые компоненты Lightning - это набор из более чем 70 компонентов пользовательского интерфейса, созданных как пользовательские элементы.
- Служба данных Lightning, которая обеспечивает декларативный доступ к данным и метаданным Salesforce, кэширование данных и синхронизацию данных.
- API пользовательского интерфейса, базовая служба, которая обеспечивает осведомленность о базовых компонентах Lightning и метаданных Lightning Data Service, что приводит к значительному повышению производительности.
Веб-стандарты + метаданные + услуги = беспрецедентная производительность
Сочетание модели программирования веб-компонентов с метаданными и службами Salesforce обеспечивает беспрецедентный уровень производительности. Например, приведенный ниже код создает компонент формы, который имеет представление и модель редактирования, знает, какой тип ввода использовать для каждого поля (поле со списком, выбор даты и т. Д.), Применяет правила проверки и сохраняет изменения в базе данных без сервера. сторонний код: 5 строк JavaScript и 5 строк HTML!
Сосуществование и взаимодействие
С добавлением веб-компонентов Lightning теперь есть два способа создания компонентов Lightning:
- Компоненты Aura, использующие собственную компонентную модель, шаблоны и модульную модель программирования разработки.
- Веб-компоненты Lightning, основанные на достижениях последних пяти лет в области веб-стандартов: веб-компоненты, пользовательские элементы, Shadow DOM и т. д.
Компоненты Aura и веб-компоненты Lightning могут сосуществовать и взаимодействовать, и они используют одни и те же службы высокого уровня:
- Компоненты Aura и веб-компоненты Lightning могут сосуществовать на одной странице.
- Компоненты Aura могут включать веб-компоненты Lightning.
- Компоненты Aura и веб-компоненты Lightning используют одни и те же базовые компоненты Lightning. Базовые компоненты Lightning уже были реализованы как веб-компоненты Lightning.
- Компоненты Aura и веб-компоненты Lightning используют одни и те же базовые службы (Lightning Data Service, API пользовательского интерфейса и т. Д.).
Если вы уже разрабатываете компоненты Lightning с помощью модели программирования Aura, вы можете продолжать это делать. Компоненты вашей Ауры продолжат работать, как и раньше. Вы можете создавать новые компоненты с помощью веб-компонентов Aura или Lightning. Ваши веб-компоненты Aura и Lightning могут сосуществовать и взаимодействовать. Со временем вы можете подумать о переносе компонентов Aura на веб-компоненты Lightning, начиная с компонентов, которые в наибольшей степени выиграют от преимуществ производительности веб-компонентов Lightning.
Если вы новичок в разработке на Lightning, или если вы начинаете новый проект, мы рекомендуем использовать модель программирования Lightning Web Components.
Резюме
Это невероятно захватывающее время, чтобы быть разработчиком Salesforce. С веб-компонентами Lightning вы используете передовую модель программирования, созданную для веб-стека 2019 с нуля и которая без проблем взаимодействует с вашим существующим кодом. Комбинация веб-компонентов Lightning и метаданных Salesforce обеспечивает беспрецедентный уровень продуктивности, производительности и… удовольствия! Мы не можем дождаться, когда вы попробуете это, и мы не можем дождаться, чтобы увидеть удивительные приложения, которые вы создадите!
Ресурсы
- Быстрый старт с веб-компонентами Lightning (проект Trailhead)
- Галерея примеров веб-компонентов Lightning
- Репозиторий Github: рецепты веб-компонентов Lightning - сборник простых для усвоения примеров кода
- Репозиторий Github: Ebikes - новый образец приложения Lightning Web Components
- Репозиторий Github: Версия примера приложения Dreamhouse с веб-компонентами Lightning
- Репозиторий Github: версия примера приложения Dreaminvest с веб-компонентами Lightning
- Репозиторий Github: версия примера приложения PureAloe с веб-компонентами Lightning
- Репозиторий Github: версия примера приложения Easy Spaces с веб-компонентами Lightning