RSS Etsy Engineering | Code as Craft

Как мы создали вкладку 'Сделки' в Swift UI

Follow
В июле 2023 года команда по обновлению приложений Etsy решила преобразовать ленту обновлений в раздел 'Скидки', посвященный купонам и распродажам. Команда рассматривала вариант разработки нового раздела с нуля, используя современные технологии, такие как Swift UI и Tuist. Сбалансировав амбиции с реализмом, команда выбрала гибридный подход, используя Swift UI для модульной разработки и предварительного просмотра, а также интегрируя с существующим кодбазом UIKit для навигации и других функций. Модульность Swift UI позволила разбивать представления на многоразовые компоненты, что обеспечивало быстрое развитие и эффективный предварительный просмотр с помощью Tuist. Были реализованы модели Decodable для ясного и эффективного разбора API, упрощая строительство представлений и обработку опциональных значений. Были введены перечисления Preview для упрощения создания макетов для сложных представлений, что позволило строить модули даже до того, как была готова поддержка API. Однако взаимодействие с существующим кодбазом создавало проблемы, особенно в таких областях, как навигация и добавление в избранное. Чтобы решить эту проблему, команда создала пользовательский структурный тип @Environment, DealsAction, который передавал ответственность за навигацию обратно в основной таргет, сохраняя при этом функцию callAsFunction() из Swift UI. Структуры Environment использовались и для других функций, таких как добавление в избранное, подписка на магазины и регистрация метрик производительности. Такой гибридный подход позволил команде воспользоваться преимуществами современных технологий, одновременно уважая ограничения наследующего кодбазы, что привело к успешному запуску продукта до начала недели киберпродаж.
favicon
etsy.com
How We Built The Deals Tab in Swift UI
Create attached notes ...