Эволюция больших проектов. Опыт API Яндекс.Карт

Антон Корзунов

Transcript

1. Эволюция больших проектов Опыт API Яндекс.Карт Антон Корзунов, разработчик интерфейсов
2. Если программу (модуль или библиотеку) рассматривать как чёрный ящик, то API — это множество «ручек», которые доступны пользователю данного ящика, и которые он может вертеть и дёргать. Википедия Что такое API
3. API Яндекс.Карт
4. Страница с очень важной информацией, которую все должны запомнить. F4
5. У инструментов, созданных для решения проблем, тоже есть проблемы. F5
6. Зачем выпускать новые версии • Новые платформы – браузеры – девайсы • Новые требования – к продукту – от продукта • Новые возможности • Новые стандарты – технологии – среда исполнения F6
7. Мир меняется вне зависимости от вашего желания, чаще даже назло. F7
8. API 1.0 → 1.1
9. Переход от 1.0 к 1.1 • Библиотека Y5 – переход на jQuery • Отсутствие макетов – добавление интерфейса ILayout • Дополнительные проекции • Косметические правки F9
11. API 1.1 → 2.0
12. Зачем выпускать новые версии F12 – Вышло много новых браузеров – Появились «тач» девайсы ! – Не монолитное ядро – jQuery не оправдал доверия – Кластеризатор, https, без ключей ! – transform, transition, canvas и т.д. • Новые платформы – браузеры – девайсы • Новые требования – к продукту – от продукта • Новые возможности • Новые стандарты – технологии – среда исполнения
13. Дополнительные требования • Мультиязычность • Компактность • Адаптивность • Поддержка мобильных устройств • Модульность • Новый дизайн • Облегченная отладка F13
14. Решение F14 • Поддержка новых технологий (и адаптивность) – реализуется через слабую связанность и возможность подмены модулей • Мультиязычность – реализуется на уровне динамических зависимостей • Компактность – модуль достаточно компактная сущность • Поддержка мобильных устройств – функционал ненужный десктопу • Модульность – панацея и решение всех проблем
15. Модульность
16. • Common-js • AMD • LMD • RequireJS • bash script … • Фатальный недостаток? Выбор модульной системы F16
17. Своя модульность • Свой формат файлов – js + module.json • Свой компилятор – склейка файлов и meta-информации • Свой загрузчик – «оптимизированный» для нас • Common-js несовместимый формат F17
18. Очередной велосипед? • Асинхронные require/provide • Единый синтаксис с обеих «сторон» API • Работа с css как с js модулями – оптимизация (csso, uglifyjs) – data uri • Пакеты • Динамические зависимости – «Run-time» определения нужных модулей – Переключаемые «темы» оформления • Оптимизация обмена данными • Сборка и раскатка «пакетами» F18
19. Сравнение этапов загрузки F19
20. Модульность позволяет • Работать в IE6 • Работать в Chrome 30+ • Работать на мобильных • Работать на телевизорах • Поддерживать и SVG, и Canvas, и VML – в том числе одновременно ! • Главное написать эти модули – API состоит из ≈1700 модулей F20
21. F21
23. Другие изменения API 2.0 • Широкие возможности контроля • Слабая связанность компонентов • Мощная система событий • Наследуемые опции • Больше абстракций • Больше правильных интерфейсов F23
24. 80% кейсов должны решаться одной строкой кода. Максимум двумя. Остальные 20% кейсов должны решаться. F24
25. Другие изменения API 2.0 • Раздельные проекции – позволяют забыть о вариантах реализации меркатора • Универсальные тайлы – позволяют одновременно показывать данные Яндекса и OSM • Встроенный кластеризатор • Именованные контейнеры – балун вне пределов карты • HTTPS • Работа без ключей F25
27. API 2.0 → 2.1
28. • Модульная система • Синхронность • Не очень слабая связанность Проблемы API 2.0 F28
29. • Common-js несовместимая • Имела ряд проблем • Сложна в поддержке • Без возможности кастомизации Модульная система F29
30. Вы просто не умеете готовить F30 322 КБ - Это норма!
31. Синхронность и связанность • Стандартные синхронные интерфейсы – все сущности должны существовать единовременно • Мешает слабой связанности на уровне модулей • Усложняет клиент-серверное взаимодействие • Может вызвать «залипоны» F31
32. Новая система модулей • Common-js/AMD совместимая – переход без изменения кода – все плюшки старой версии • Открытая – https://github.com/ymaps/modules/ F32
33. Асинхронность • Повсеместное использование Promises/A+ – https://github.com/dfilatov/vow • Асинхронные интерфейсы – доступа к данным – создания объектов • И немного другой магии F33
34. Скорость • Тормозит добавление меток? – не добавлять метки – не добавлять им DOM события • Тормозят опции? – изменить принцип подписки • Томозит XXX? – иди играть в пин-понг, спроси совета у жены F34
35. Новые горизонты F35 • Поддержка экранов высокой четкости – HD-тайлы – SVG-метки и верстка • Больше кейсов решаются «из коробки» – Адаптивные контролы – Больше полезных build-in функций • Более «user friendly» • Подгрузка функционала по требованию • Еще больше магии
36. Мы за вами следили
37. 5 лет разработки
38. • Нострадамусов мало • Никто не знает ваш продукт лучше чем его пользователь • Даже вы • Старайтесь смотреть шире и искать даже под кроватью • Не взрывайте мосты и обходные пути • В любом случае всё придется переделывать Памятка разработчику F38
39. Интерфейсы — суть API • Должны быть компактны • Унифицированы • Самодостаточны • Слабо связаны • Обоснованы • Не должны связывать вам руки F39
40. Оптимизация ! • Оптимизация под задачу • Оптимизация архитектуры • Оптимизация алгоритмов F40
41. Самое главное • Любите свой продукт – Делайте его достойным этого • Ненавидьте свой продукт – Критически относитесь ко всему • Используйте свой продукт – Чтобы понимать — «как это» F41
42. Умейте находить и признавать свои ошибки. F42
43. API Яндекс.Карт kashey@yandex-team.ru api.yandex.ru/maps clubs.ya.ru/mapsapi facebook.com/ymapsapi Спасибо Антон Корзунов