Как большие фабрики разрабатывают и внедряют интерфейсный код? Taobao 8 лет интерпретация случаев

внешний интерфейс
Как большие фабрики разрабатывают и внедряют интерфейсный код? Taobao 8 лет интерпретация случаев

Автор|Чжан Вэй (Uphill)

Редактор | Orange Jun

Произведено | Alibaba New Retail Tao Department Технологический отдел

В интерфейсной группе Tao отдела Alibaba модель разработки и развертывания все еще находится в процессе постоянных изменений с развитием технологий. С одной стороны, сложные модули возможностей внутри и вне системы постоянно развиваются, а с другой стороны, базовые технологические основы, такие как LSP и DAP, постепенно совершенствуются. В настоящее время мы интегрируем и сублимируем экологию НИОКР, которая была заложена на предыдущем этапе, путем интеграции среды НИОКР IDE, реорганизации исходных ссылок, нахождения прорывов в болевых точках текущих пользователей и изучения текущих НИОКР. возможности на сцене, построить общую базовую платформу, обновить и реформировать существующую модель.

Как фронтенд-разработчик от стажировки в 2014 году до официального вступления в компанию в 2015 году, он ранее был известен как фронтенд-команда Taobao.Amoy Front TeamЯ испытал изменения в методах разработки и развертывания, больших и малых, и мне также повезло, что я участвовал в создании некоторых из этих возможностей во всей тенденции изменений. Сегодня он с точки зрения свидетеля, через собственный опыт и своих коллег поэтапно вспомнит и расскажет.

Ответ делит всю историю на четыре этапа: первый — «каменный век», в котором хранение кода, развертывание и преобразование в технологическую систему Gitlab были основной темой примерно через 13 лет; примерно через 14 лет, со зрелостью технологии NodeJS интерфейсный язык JS использовался для создания инженерных инструментов «Серебряного века»; с 2015 года, после завершения попытки разработки инженерных инструментов с помощью технологии NodeJS, наступил «золотой век» создания онлайн и оффлайн фронта. - более систематически завершать инженерную систему; и теперь мы используем клиент, контейнер, алгоритмы и другие разнообразные технологии, чтобы создать «будущую эру» будущих моделей НИОКР.

Каменный век

Тринадцать лет назад фронтенд-модель НИОКР мало чем отличалась от бэкэнд-метода НИОКР, большинство из которых основывались на SVN для управления кодом SCM. После завершения ежедневной работы по разработке кода через командную строку илималенькая черепахаи другие инструменты для загрузки кода на сервер SVN для завершения дневного процесса разработки. На этапе развертывания тестовый код загружается на тестовый сервер путем копирования вручную или загрузки по FTP. процесс развертывания.

В этот период помимо SVN также появился инструмент управления кодом Gitlab, основанный на протоколе GIT. Столкнувшись с преимуществами удобства определения версии, обеспечиваемого алгоритмом SHA-1, и гибкости локально распределенного контроля версий кода, мы постепенно перенесли рабочий процесс исследований и разработок SVN в отделе на Gitlab. В то же время это изменение также можно рассматривать как начало реформы передовых исследований и разработок Департамента Дао.

Ощутив удобство, которое принесло переключение инструментов управления версиями кода, мы подумали, можно ли еще больше улучшить процесс развертывания, который был громоздким в эксплуатации и требовал ручных гарантий, в новой системе. В контексте новой системы релизов, среди различных возможностей, предоставляемых новой системой Gitlab, мы обнаружили, что механизм вебхуков может быть инкапсулирован в некий верхний уровень, и с помощью штатных операций связь с системой релизов может запускаться для автоматического завершения онлайн-процесса выпуска. Мы запускаем уведомление о событии веб-перехватчика на основе тега Git с фиксированными правилами, такими как информация о публикации/версии, и запускаем вызов и онлайн-процесс системы публикации, тем самым завершая первый практический полностью автоматизированный процесс публикации переднего плана исследований и разработок.

Этот этап столь же примитивен, как и «каменный век», но после завершения трансформации инфраструктуры НИОКР обеспечивает прочную основу для последующего развития. В то же время, с развитием передовых технологий, мы также вступили в новую стадию, основанную на этой базовой системе.

серебряный век

Около 14 лет назад технология NodeJS, которая рождалась более 5 лет, постепенно становилась зрелой.В то время команда, основанная на NodeJS, выпустила набор R&D локальных терминальных инструментов CLI под названием DEF.Ядром инструмента является комплект установки Node.Module, механизм управления звонками. Разработчики инструментов инкапсулируют функциональные модули НИОКР в виде подключаемых модулей в системе DEF и реализуют такие операции, как компиляция, отладка и запуск интерфейсных проектов, посредством вызова и комбинации различных подключаемых модулей.

В рамках системы исследований и разработок фреймворка KISSY в то время мы использовали возможности NodeJS для компиляции скриптов посредством регулярного сопоставления, парсинга AST UglifyJS и т. д. и начали создавать инженерные инструменты в области переднего плана с помощью технологии JS, постепенно заменяя использование системы java.Инструменты, реализованные платформой Ant.

В то время, помимо использованияyeomanи другие инструменты для завершения процесса инициализации, а с непрерывной абстракцией бизнес-компиляции и логики построения создаются базовые концепции, такие как компоновщики.

В традиционной проектной организации того времени логика конфигурации для компиляции сборки и файлы кода проекта размещались в одном каталоге кода. С точки зрения команды, эта часть логики построения и компиляции разбросана и свободна, и нет единой логики управления обновлениями. Если в команде происходят какие-либо обновления и изменения в инструментах построения и компиляции определенного типа сценария НИОКР, покрытие обновлений инструментов внутри команды потребует очень больших затрат; в то же время, с точки зрения пользователя, просмотра, в разных проектах одного типа Также существует большое количество зависимостей сборки, которые повторно устанавливаются.Каждый проект также должен устанавливать зависимости сборки перед сборкой, что тратит впустую определенную долю места и времени.

Зависимости сборки объединяются и абстрагируются с помощью концепции компоновщика, а зависимости сборки проекта поддерживаются в пакете npm. Таким образом, логика компиляции изменилась с «многие ко многим» на «один ко многим».Существенно уменьшая пространство, занимаемое логикой сборки, она также может лучше повторно использовать установленные зависимости сборки, упростить процесс сборки и улучшить эффективность сборки. Это также заложило основу для последующей системы онлайн-строительства.

На этом этапе технология NodeJS постепенно стала еще одним базовым навыком в дополнение к нашей ежедневной разработке страниц. С рождением и масштабным применением инструментов NodeJS разработка и развертывание интерфейса перешли из «каменного века» в «Серебряный век». По мере того, как базовое применение системы NodeJS становится все более и более зрелым, мы начинаем проводить более глубокое осмысление, дивергенцию и абстрактный дизайн, основанный на использовании базовой системы, и начинаем создавать более зрелую интерфейсную инженерную систему. .

Золотой век

После того, как команда завершила создание инженерных инструментов, основанных на технологии и инфраструктуре NodeJS, таких как фреймворки веб-сервисов, в последующие годы разрабатывались все более и более зрелые онлайновые и автономные инженерные системы. Услуги и инструменты, разработанные и созданные на этом этапе, постепенно сформировали инфраструктуру в процессе передовых исследований и разработок и развертывания отдела Tao.

Комплект НИОКР

С развитием собственных инструментов DEF появилось все больше и больше плагинов для инструментов. С одной стороны, у пользователей есть большой выбор инструментов, и в основном функции локального процесса НИОКР можно найти в экосистеме плагинов, но с другой стороны, с точки зрения реальных пользователей, при разработке определенного проекта , пользователи должны понимать проект.Используемые плагины и их использование должны быть в определенной степени знакомы и знать наилучший метод комбинирования. По мере того, как количество проектов постепенно увеличивается, стоимость памяти комбинации инструментов становится высокой, а также необходимо обращать внимание на переключение комбинации плагинов между разными проектами.

После того, как расцвели сотни цветов, мы выдвинули концепцию пакета исследований и разработок поверх оригинальных локальных инструментов DEF перед лицом расширенных проблем. Путем суммирования и конвергенции в локальном процессе исследований и разработок абстрагируются функциональные узлы пяти локальных инструментов: инициализация инициализации, предварительный просмотр компиляции разработки, построение сборки, тестовое тестирование и публикация. После классификации исходных возможностей подключаемых модулей в соответствии с типом НИОКР проекта стандартные локальные инструменты для каждого типа типа НИОКР — комплекты НИОКР суммируются и выделяются.

Благодаря пакетной концепции комплекта пользователи могут напрямую использовать единую команду при разработке между различными проектами, а также выполнять запуск и использовать соответствующие сервисы инструментов для разработки проектов. В то же время новая локальная система пакетов также может иметь более детальный и гибкий метод обозначения версии для каждого пользователя. Оснащенные более полной системой мониторинга журналов, пользователи могут воспринимать и решать проблемы в режиме реального времени, когда они сталкиваются с проблемами, и в наибольшей степени обеспечивать опыт использования местных инструментов исследований и разработок для передовых студентов.

Платформа для развертывания НИОКР

После того, как процесс публикации интерфейсных ресурсов с помощью возможностей веб-перехватчиков Gitlab станет зрелым, с одной стороны, пользователи R&D ожидают более оптимизированного опыта публикации в процессе публикации, а с другой стороны, команда станет более систематической и структурированной. управление процессами и статистика данных для начального процесса НИОКР Существуют также более высокие требования.

В связи с этим мы создали платформу развертывания исследований и разработок в системе внешнего интерфейса, открыв возможности публикации по исходной ссылке и соединив все ссылки в ссылке публикации в более удобный ряд. С точки зрения опыта, пользователи могут напрямую запускать задачу публикации с помощью простой команды командной строки, что упрощает процесс работы тегов публикации git при публикации. В течение всего процесса публикации информация об операции и журналы каждой ссылки возвращаются и отображаются через длинное соединение, предоставляя ссылку публикации для новой операции. Впервые пользователи имеют более полный контроль над процессом публикации: от начала отправки и обнаружения кода до окончательного запуска CDN ресурса происходит полное раскрытие информации, что значительно улучшает опыт публикации.

Платформа исследований и разработок и развертывания, основанная на внутренней реализации NodeJS, после завершения базовой ссылки постепенно начала служить основой для онлайн-процесса инженерных исследований и разработок с более систематической точки зрения, изменяя исходную ссылку онлайн-релиза. . . . Ссылки в исходном процессе абстрагируются и постепенно распределяются по трем основным этапам построения, обнаружения и освобождения. В процессе перехода с ПК на беспроводную связь с типом бизнес-исследований и разработок, основанным на трех основных шагах, концепция типа выпуска в области переднего плана постепенно инкубируется на верхнем уровне исполнения. Например, в то время существовали типы веб-приложений, типы интерфейсных ресурсов, приложения Weex и другие типы.Основная система приняла различные схемы развертывания выпусков для деталей общего процесса выпуска для каждого типа выпуска подразделения, а также локальные Исследования и разработки в сочетании с набором инструментов, чтобы сформировать унифицированный метод сочетания исследований и разработок онлайн и офлайн-связей, а также обеспечить лучший опыт развертывания исследований и разработок для каждой модели исследований и разработок более совершенным образом.

Отныне пользователям больше не нужно инициировать процесс публикации через веб-хук Gitlab, а «онлайн в один клик» означает, что система разработки интерфейса вступила в новую стадию.

облачная сборка

На предыдущем этапе путем централизации инкапсуляции логики компиляции и в виде npm мы сформировали описание спецификации в процессе разработки, компиляции и сборки. Однако при развертывании и онлайн-связи сборщик не связан последовательно с процессом онлайн-развертывания, и разные локальные системные среды также приведут к нестабильным результатам построения.

В то время, с развитием технологии докеров, мы думали реализовать рабочую среду сборщика за счет способности докера быстро запускать и останавливать унифицированную среду, а также моделировать локальный процесс компиляции и сборки с помощью контейнера-контейнера, запускаемого докером. В то же время использование унифицированной среды контейнера в сочетании с информацией об идентификации версии, такой как коммит, предоставленный Gitlab после описанной выше миграции, может в наибольшей степени обеспечить стабильность и единство содержимого конструкции.

После периода исследования, посредством проверки и исследования в системе, таких как создание внешнего кластера контейнеров докеров, последовательное подключение сетевого канала между контейнерами и приложениями, построение и построение логики стратегии планирования задач и использование Redis для открытия лог запуска контейнера docker и другие технические ссылки, после чего построили систему облачного построения в области фронтенда непрерывной интеграции на основе контейнерной технологии.

В фреймворке приложений NodeJS через Tao DepartmentmidwayjsЗавершая создание возможностей онлайн-строительства, мы также постепенно внедряем более удобную и полную бизнес-логику онлайн-строительства на стороне бизнеса. Вызывая службу облачного строительства при публикации процесса в Интернете, деловые отношения между строителем, складом и пользователем последовательно соединяются в процессе выполнения всей задачи строительства. В рамках этой сети отношений мы установили полное управление планированием выполнения задач, которое может полностью записывать конкретную ситуацию выполнения задачи строителя.

С точки зрения построителя вы можете увидеть выполнение построителя для разных складов с полным журналом выполнения, временем сборки и записями об ошибках сборки, что удобно для пользователей для устранения неполадок и оптимизации производительности построителя. Для итеративного обновления построителя разработчик построителя может разделить и установить диапазон оттенков серого для пользователя, а также обеспечить стабильное покрытие онлайн через полный процесс оттенков серого при изменении версии. Если в процессе публикации компоновщика возникла проблема, немедленно отмените обработку оттенков серого. Благодаря этому режиму риск выпуска версии сведен к минимуму. В сценариях с большим горизонтальным покрытием ключевую роль играет полный механизм публикации в градациях серого.

Ссылка, по которой пользователям нужно отправить локальный код сборки на склад в процессе исследований и разработок, с тех пор стала историей.После того, как исходный код разработан, исходный код напрямую отправляется на склад, и система облачной сборки автоматически построить стабильную систему при выполнении задачи выпуска. , Унифицированные выходные результаты построения.

дверной бог

После завершения процесса компиляции и сжатия проекта кажется, что он достиг внешних ресурсов процесса развертывания.Перед лицом все более сложных бизнес-сценариев все еще остается много скрытых проблем.В прошлом ручная проверка Метод Постепенно стало невозможно гарантировать надежность интернет-ресурсов. В этом контексте также необходимы процесс и стандартизированный метод для вмешательства в систему и обнаружения, и последняя линия защиты для высвобождения ресурсов выполняется.

Подобно построению облака, рабочая среда проверки онлайн-ресурсов построена на основе NodeJS, а логика проверки дополнительно абстрагируется, а концепция инспектора абстрагируется, перенося ее в форме npm. После того, как пользовательский ресурс завершит всю предварительную обработку, он входит в систему бога дверей, чтобы параллельно проверить выполнение задачи.После завершения проверок, таких как адреса ресурсов, конфиденциальные слова, комментарии к коду и т. д., соответствующие результаты обработки возвращаются пользователю через различные уровни результатов проверки. Как последний уровень ресурсов перед выходом в сеть. Название системы — «Бог дверей», что означает обеспечение базового качества и безопасности каждого выпускаемого ресурса.

Благодаря автоматизации дверного бога пользователям больше не нужно «привлекать внимание», чтобы проверять различные проблемы, которые нельзя найти с помощью обычных инструментов компиляции, прежде чем выходить в интернет, и легко выходить в интернет.

Возможность открытия

С одной стороны, с непрерывным развитием фронтенд-инженерной области внутри системы продолжает появляться больше решений для НИОКР наряду с непрерывным развитием бизнес-сценариев, фактических спецификаций и инфраструктуры для сценариев НИОКР. В этом контексте базовые возможности были дополнительно абстрагированы и открыты.Бизнес-система верхнего уровня может построить внешний процесс НИОКР, принадлежащий ее собственной бизнес-системе, используя зрелые базовые инженерные возможности среднего уровня в соответствии со своими собственными потребностями. деловые условия.

Например, с точки зрения системы Ali разные клиенты доставки, разные формы организации ресурсов и общая абстракция базовых инженерных возможностей в конечном итоге позволят разработчикам каждого бизнес-сценария получить лучший опыт НИОКР в бизнес-сценарии проекта.

Платформа сборки Bei

Как спроектировать строительную услугу, которую использует экономика Али - Tianma

В дополнение к регулярным исследованиям и разработкам проекта, в рамках системы электронной коммерции, особенно в маркетинговых сценариях, необходимо быстро создавать страницы. В контексте таких бизнес-сценариев была выведена платформа для создания страниц с помощью модулей. Переделывая страницу и разделяя ее на скелет страницы и модуль страницы, эти элементы страницы разрабатываются студентами, работающими с интерфейсом, объединяются и сопоставляются после завершения разработки, а поток бизнес-данных открывается для реализации возможности быстрого строить страницы.

После завершения разработки локального модуля студенты, занимающиеся передовыми исследованиями и разработками, будут публиковать ресурсы модуля в Интернете и завершать публикацию на уровне страницы после сборки страницы и предварительного просмотра внедрения контекста в системе построения. Внизу исходная система, реализованная NodeJS, также используется для распространения контента CDN обратно в исходную точку, обеспечивая предварительный доступ для сотен миллионов пользователей. После нескольких поколений разработок и изменений эта система стала одним из основных сценариев текущих передовых исследований и разработок.

За несколько лет, прошедших с 2015 года, с развитием технологий передовая система исследований и разработок Департамента Тао постепенно превратилась из первоначальных локальных инструментов и платформ развертывания исследований и разработок в качестве авангарда в систематические профессиональные решения онлайн и офлайн. Обеспечивая непрерывный прорыв и модернизацию базового опыта в области НИОКР для передовой роли, передовая инженерная конструкция в масштабе предприятия будет постоянно подталкивать ежедневную разрозненную форму НИОКР к более систематической, эффективной и масштабируемой модели НИОКР, а также обеспечивать продолжение Прорыв и модернизация модели развертывания НИОКР более высокого уровня заложили прочную основу.

будущая эра

На основе постепенно зрелой инженерной системы в последние несколько лет мы также думаем о том, могут ли быть более прорывные и ориентированные на будущее решения в условиях повышения эффективности НИОКР. С непрерывным преобразованием и итерацией многих внутренних продуктов также появилось направление и способ, при котором одна искра может разжечь степной пожар.

D2C

imgcookПервоначально проект возник из визуального построения, и модель НИОКР, видимая снаружи, также подвергалась постоянному совершенствованию и изменениям. В целом изменение модели НИОКР с внешней точки зрения прошло несколько стадий: Первый этап: в то время пользователи использовали способ создания страниц путем перетаскивания элементов страницы, а затем публикации исходного кода после создания исходного кода.

Второй этап: путем создания механизма сканирования изображений для макета с пиксельным сканированием и доступа к инструментам визуального дизайна, таким как эскиз, проект дизайна автоматически преобразуется.На этом этапе метод исследования и разработки внешних пользователей начинает меняться на загрузку. визуальный черновик для платформы обрабатывает преобразование кода;

Третий этап: на текущем третьем этапе платформа улучшает способность преобразования кода изображения с помощью технологий искусственного интеллекта, таких как глубокое обучение, и в то же время улучшает базовую связь НИОКР на стороне платформы. Внутренняя модель исследований и разработок также постепенно переключается на работу в инструментальных средствах проектирования и кодирования, чтобы обеспечить единый опыт исследований и разработок и онлайн-операций.

В настоящее время возможности D2C постепенно проверяются в R&D сценариях интеллектуального восстановления компонентов, форм, модулей и страниц, и получены определенные достижения.

IDE

В прошлом году мы также постепенно инвестировали в строительство новых направлений IDE, надеясь инкубировать новые и более эффективные модели R & D через возможности IDES.

внешние тренды

С внешней точки зрения можно увидеть две тенденции. Во-первых, постепенно появляются стартапы, связанные с областью IDE, и появилось много родственных стартапов-звезд, например, в рамках системы Eclipse.theia, реализованный через совместимый интерфейс VSCodecoder, а также новички в области редактирования НИОКРcodesandbox; Другой — добавление поставщиков облачных услуг: AWS приобрела Cloud9, Tencent приобрела Coding, а Azure предоставила услуги Codespace.

Благодаря постоянному развитию и зрелости таких технологий, как редакторы и Docker, различные поставщики услуг, связанных с IDE, надеются использовать возможность интеграции среды исследований и разработок, чтобы найти возможности для повышения эффективности исследований и разработок и улучшения опыта, чтобы устранить болевые точки пользователей и расширить рынок сбыта продукции.

внутренняя система

По мере непрерывной дифференциации и развития модели передовых исследований и разработок появляется все больше и больше инструментов и услуг. Текущие формы инструментов и служб — это не только инструменты терминала командной строки, упомянутые выше, или инструменты терминала постепенно стали начальным входом в многофункциональные интерактивные инструменты и службы. В то же время бизнес-модель НИОКР часто должна быть связана с инструментами и услугами НИОКР, предоставляемыми разными системами и разными командами. Например, в текущих исследованиях и разработках мини-программ Alipay в дополнение к базовым службам компиляции и службам предварительного просмотра требуются такие службы, как симуляторы, отладчики и отладка реальной машины.

Апплет Alipay на самом деле является микрокосмом множества внутренних сценариев Текущее решение апплета Alipay фактически заключается в создании локальной платформы с помощью платформы Electron.средства разработки IDE. На этом фоне в прошлом году также началось построение базовой системы IDE. Ожидается, что базовые решения IDE для онлайн и офлайн будут реализованы через набор нижних уровней IDE.

С помощью механизма подключаемых модулей, лежащего в основе IDE, отдел Tao также инкубировал свои собственные интегрированные в IDE инструменты исследований и разработок, такие как D2C, апплет Alipay, безсерверные и другие сценарии, упомянутые выше, все из которых находятся в полном разгаре для внутреннее расширение и улучшение. Через IDE и систему подключаемых модулей IDE, с одной стороны, мы улучшаем базовый опыт исследований и разработок с помощью экосистемы VSCode, а с другой стороны, мы используем возможности пользовательского интерфейса подключаемого модуля, которые расширяет подключаемый модуль. помимо возможности VSCode соединить все задействованные проекты в единую ссылку проекта, инструменты, сервисы.

Отличие от предыдущего процесса заключается в том, что, помимо последовательной интеграции процесса онлайн-выпуска и развертывания, все текущие операции НИОКР в процессе НИОКР, включая кодирование НИОКР, предпросмотр отладки и процессы развертывания, органично организованы в едином R&D IDE Подключен, все операции выполняются напрямую через R&D панель. Это семя, которое мы посадили для будущего, которое медленно прорастает.

Весь ответ фактически знакомит с некоторыми процессами, связанными с внешними исследованиями и разработками и развертыванием отдела Дао, с точки зрения сотрудника в системе.Мы также исследуем и разрушаем текущую модель исследований и разработок днем ​​и ночью и, наконец, представляем что сделала команда.

Мы являемся передовой командой Департамента Дао - инженерной командой среднего уровня.В качестве передовой исследовательской и опытно-конструкторской инфраструктуры переднего плана Департамента Дао и переднего конца Ali Group мы в настоящее время строим система, связанная с фронтенд-инжинирингом.Есть несколько вещей:

  1. Передовая модель исследований и разработок нового поколения: благодаря самостоятельно созданному базовому нижнему слою Alibaba IDE KAITIAN с помощью базовых возможностей, таких как согласованность на обоих концах нижнего уровня, визуальная система подключаемых модулей и другие базовые возможности для глубокой интеграции и интегрируйте существующие активы службы НИОКР, создайте текущие и будущие модели НИОКР, и новые области ждут, пока вы структурируете их.
  2. Базовые инженерные услуги переднего плана: на основе NodeJS, Docker и других возможностей для создания процессов непрерывной интеграции передних отделов НИОКР миллионы задач ждут, пока вы их оптимизируете и решите.
  3. Крупномасштабный исходный сайт CDN: на основе NodeJS для реализации основных услуг основной CDN группы обратно к источнику, продвижения инфраструктуры и ожидания, пока вы «управите самолет и смените двигатель»