Теперь фронтенд-работа — это гораздо больше, чем просто нарезка диаграммы, и содержание работы намного богаче: некоторые фронтенд-инженеры могут создавать интерфейсные фреймворки и SDK, некоторые могут создавать платформы, некоторые могут создавать цепочки инструментов для проектирования и некоторые могут заниматься бизнес-разработкой, а некоторые будут участвовать в уровне движка, настраивать движок js и реализовывать движок рендеринга.
Так много типов внешнего рабочего контента, какова связь между ними? Какие виды фронтенд-работ существуют?
В этой статье будет рассмотрен этот вопрос: каково содержание фронтенд-работы и какова связь между ними.
Пять уровней фронтенд-работы
Интерфейсную работу можно условно разделить на пять уровней: снизу вверх: уровень движка, уровень среды выполнения, уровень инструментов, бизнес-уровень и уровень построения.
Рассмотрим их отдельно:
слой двигателя
Теперь работающим контейнером фронтенд-кода является не только браузер, но и многие другие контейнеры, например, электрон можно использовать для кроссплатформенной разработки на десктопной стороне, а десктопные приложения можно разрабатывать через фронтенд стек технологий, например React Native, weex или кросс-энд-движок собственной разработки. Стек интерфейсных технологий можно использовать для разработки приложений для Android и iOS. Например, механизм апплета также поддерживает стек интерфейсных технологий для разработать кроссплатформенный апплет.
Реализация этих контейнеров в основном расширяет движок js, такой как v8 и javascriptcore, внедряет в них некоторые dom api и API возможностей устройства, а также реализует движок рендеринга, реализующий рендеринг css разными платформами. Это поддерживает интерфейсный код, работающий на разных платформах.
Настройка движка js и реализация движка рендеринга основаны на C++. В этих вещах будут участвовать некоторые фронтенд-студенты, которые понимают C++. Например, движок рендеринга Ali kraken разработан фронтенд-студентами.
уровень выполнения
После того как движок или контейнер реализует некоторые API стандарта w3c, верхний уровень может использовать интерфейсные технологии для разработки приложений. Но w3c api слишком примитивен, мы вообще внедряем front-end framework и какой-то sdk.
Фронтенд-фреймворк реализует компонентизацию и рендеринг на основе данных, так что нам не нужно напрямую вызывать dom api, а только управлять данными. Изменения данных автоматически вызовут повторный рендеринг dom api.
Работа некоторых фронтенд-студентов заключается в поддержке интерфейсных фреймворков и SDK, таких как интерфейсный фреймворк Baidu san, кросс-энд интерфейсный фреймворк Ali rax и т. д., а также различных js SDK.
слой инструментов
Движок поддерживает выполнение js и отрисовку css, но мы можем не писать js и css напрямую во время разработки, а использовать typescript, es next и т.д., а css также будет использовать препроцессоры типа less и sass, так что нужно быть скомпилировано. И чтобы лучше распространять код, код будет запакован. Код также проверяется перед компиляцией.
Это инженерные наборы инструментов.Некоторые студенты выполняют такие задачи, как упаковка webpack или vite для создания готовых cli, таких как компилятор собственной разработки моей предыдущей компании. Например, в эту категорию входит mordern.js, исходный код которого был только что открыт по байтам.
Бизнес-уровень
Движок обеспечивает возможность выполнения клиентского кода, уровень выполнения предоставляет простую в использовании интерфейсную структуру и пакет SDK, а уровень инструментов предоставляет готовую цепочку инструментов для компиляции и упаковки, так что студенты, изучающие бизнес-развитие, могут быстро удовлетворить свои бизнес-потребности на их основе.
Большинство интерфейсных разработок работает на этом уровне, и другие уровни также обслуживают этот уровень. Ведь бизнес – это основа существования компании.
построить слой
Чтобы повысить эффективность доставки и освободить интерфейсную разработку бизнес-уровня, все больше и больше компаний теперь будут создавать платформу для визуального построения для не-разработчиков, чтобы реализовать некоторые требования, чтобы у фронтенд-разработки было больше времени. чтобы сделать некоторые другие слои, что-то более сложное.
У многих компаний будет часть интерфейса, чтобы сделать эту платформу для строительства и доставки, пытаясь напрямую решить тип спроса.
Совершенство пяти слоев
Вышеупомянутые пять уровней в основном охватывают большую часть рабочего контента переднего плана, но пять уровней разных компаний имеют разную степень совершенства.Некоторые компании могут иметь работу только бизнес-уровня и уровня инструментов, в то время как некоторые компании будут выполнять Многоуровневые вещи, и некоторые компании будут делать что-то на уровне выполнения или даже на уровне движка.
Моя последняя компания сделала все пять из этих вещей:
- Слой движка: он имеет собственный кросс-энд движок и реализует API-интерфейсы dom, API-интерфейсы устройств и движок рендеринга уровня движка.
- Уровень выполнения: у него есть собственная интерфейсная структура и некоторые другие библиотеки времени выполнения.
- Инструментальный уровень: есть саморазрабатываемые компиляторы, инструменты отладки и инструменты lint.
- Бизнес-уровень: каждое бизнес-направление разрабатывается на кросс-энд движке, основанном на интерфейсной платформе и цепочке инструментов.
- Строительный слой: страница активности и некоторые другие сценарии уже появились на инвестиционной платформе.
Сложность этих пяти уровней определяет объем того, что может сделать внешний интерфейс. Front-end работа предыдущей компании включает в себя все пять слоев, и глубина относительно велика, так что там можно сделать больше вещей.
Суммировать
Существует много типов внешнего рабочего контента, но в целом его можно разделить на пять уровней:
Слой движка, уровень времени выполнения, уровень инструментов, бизнес-уровень, уровень построения.
У разных слоев разные интересы.
Совершенство этих пяти слоев также определяет вертикальную глубину того, что может сделать передняя часть.Чем совершеннее эти пять слоев, тем больше вещей может сделать передняя часть.
Подумайте об этом, где ваша работа? Или какую работу вы хотите делать больше?