Меньше чем за год Walmart.com завершил миграцию на React/Node.js, и мы рады сообщить вам об этом! Цель миграции заключалась в создании новой платформы для повышения эффективности WalmartLabs и ее инженеров в будущем.

Мы рады сообщить о том, что мы выложили в open source Electrode — платформу, на которой построен Walmart.com.

Масштабы Walmart.com

80 миллионов ежемесячных посетителей, нагрузки до 10000 запросов в секунду, и 15 миллионов товаров, каждый месяц добавляется более 1 миллиона товаров — нагрузки Walmart.com на сегодняшний день. С e-commerce бизнесом, который является второй по величине компанией по розничной торговле в США, нам необходимо не только поддерживать и улучшать Walmart.com, но и максимально задействовать талант и поощрять творческий подход наших инженеров.

Основные цели

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

• Упорядочение цикла разработки — мы хотели, чтобы наши разработчики могли как можно быстрее влиться в разработку, тем самым сократить время разработки проектов. На начальном этапе проекта разработчикам нужно проделать существенный объем работы по конфигурации различных технологий (таких как server-side рендеринг, redux, webpack, css modules, post css, деплой скрипты, интернационализация, JS/CSS linting, настроить karma/mocha, code coverage и т.д.). Для запуска новых приложений, мы хотели объединить все это в одной простой библиотеке с расширяемой структурой, используя передовые разработки. Таким образом Electrode позволяет разработчикам сфокусироваться на реализации функционала, который нужен клиентам.
  
  
• Структура и Передовые технологии — с парой сотней инженеров, работающих на десятках различных проектах в WalmartLabs, нам нужно быть уверенными, что все наши приложения согласованы по архитектуре, надежны и легко расширяемы. Нам также нужно обеспечить возможность частых обновлений на всех проектах, предоставляя разработчикам инструменты кодогенериции, которые предоставляют оговоренную структуру для модулей и уменьшают рутинную работу. Система Electrode Archetype дает нам руководство и структуру для построения приложений, которым мы можем доверять.
  
  
• Повторное использование кода — WalmartLabs поддерживает 12 сайтов Walmart в 11-ти странах, включая SamsClub.com в США и Asda в Великобритании. Обмениваться и использовать одни и те же React компоненты на разных проектах — отличный способ повысить эффективность, но только в том случае, если этим компонентам можно доверять, они качественны и стабильны. Electrode Archetype позволяет придерживаться определенной структуры, а инструменты, как Electrode Explorer, позволяют легко найти нужный компонент среди тысячи других.
  
  
• Производительность/Universal JavaScript — Мы были уверены, чтобы отображение страниц на стороне сервера (server side rendering) могло бы улучшить производительность приложения и SEO, поэтому Electrode предоставляет Вам готовое решение. Но мы увидели дополнительные возможности и пошли дальше, тем самым создав Electrode Caching and Profiling(профилирование и кешинг компонентов на сервере), Above the Fold Render(предотвращает отображение компонентов на сервере) и Redux Router Engine(обрабатывает асинхронные данные на сервере).

Electrode предоставляет решения вышеупомянутых проблем, и мы хотели бы поделиться этими решениями с сообществом.

Используйте Electrode в Вашем приложении!

Наша философия в создании Electrode заключается в том, чтобы разработчики могли бы использовать только то, что нужно без изменения архитектуры приложения. Поэтому мы разделили архитектуру на три части: Electrode Core, Electrode Modules и Electrode Tools.

1. Electrode Core — позволяет начать новый проект быстро с простой, но заданной архитектурой, использующей передовые технологии.
   
   
2. Electrode Modules — дает доступ к модулям, которые позволяют выполнять различного рода задачи от отображения на сервере до гибкого контроля настроек. Эти модули могут использоваться независимо от Electrode Core, что означает возможность их использования в ваших проектах.
   
   
3. Electrode Tools — используйте наши мощные разработки, которые включают в себя инструмент поиска компонентов(Electrode Explorer) для многократного использования и для оптимизации JavaScript бандлов (Electrify и Bundle Analyzer). Эти инструменты могут быть использованы в существующих приложениях независимо от использования Electrode Core.

Если коротко, Electrode является качественной платформой для создания Universal React/Node.js приложений. С ее помощью был разработан Walmart.com. Теперь разработчики могут использовать Electrode платформу или ее отдельные части, по мере необходимости.

Как Electrode повлиял на WalmartLabs

• Масштаб использования — большая часть Walmart.com теперь работает на платформе Electrode, в том числе домашняя страница, логин, корзина, оплата, категории и просмотр товаров. Мы находимся в процессе миграции SamsClub.com на Electrode и планируем использовать Electrode для Walmart Grocery в следующем году.
• Производительность — наша направленность на производительность значительно повлияла на наши приложения. Среди страниц, возвращаемых с сервера: домашняя страница теперь на 20% быстрее, а страница логина — на 15%. На странице оформления заказа, которая отображается на стороне клиента, теперь на 20% быстрее. Страницы, которые отображались только на стороне клиента и теперь отображаются и сервером, и мы получили улучшение производительности до 30% в некоторых случаях. Кроме того, размер JavaScript кода на странице уменьшился на 20%.
• Продуктивность разработчиков — новые инженеры начинают разрабатывать в первый же день работы в WalmartLabs. Большинство инженеров в состоянии производить рабочий код в течении нескольких дней после начала работы.
• Повторное использование кода — мы наблюдаем огромное количество React и Redux компонентов, использующихся во всех наших приложениях и брендах, как Walmart.com и SamsClub.com. В результате, когда одно приложение или бренд могут быстро и легко использовать функционал, созданный для другого бренда/приложения происходит значительное снижение времени разработки проекта.
• В целом, наши инженеры довольны использованием передовых технологий, у нас активное внутреннее сообщество разработчиков, и Walmart конкурирует на рынке более эффективно.

Инвестируя в будущее

Мы по-прежнему улучшаем Electrode. Дальнейшие улучшения будут направлены на мобильные устройства, производительность и многое другое. И, потому что WalmartLabs привержен к open source, наши инвестиции — это инвестиции для всех разработчиков, которые хотят использовать Electrode.

Мы были бы очень рады увидеть приложения, созданные с использованием Electrode. Вы можете детальнее изучить функционал Electrode на официальном сайте electrode.io, прочтите Краткое руководство или же просто изучайте проект на GitHub.