Отчет и презентации с Moscow JS в офисе Superjob
- четверг, 6 апреля 2017 г. в 03:14:04
https://habrahabr.ru/company/superjob/blog/325512/
В офисе Superjob состоялась встреча JavaScript-разработчиков MoscowJS. Рассказываем, что обсуждали участники, и делимся презентациями.
Александр Савин, Superjob
Трудно переоценить важность тестирования в процессе разработки. Тестирование интерфейсов скриншотами — один из подходов, который не только вовремя сигнализирует о регрессии в CSS, но и позволяет проводить рефакторинг шаблонов и стилей, не меняя тесты, упрощает процесс ревью. Однако при внедрении такого тестирования существует ряд типичных проблем, начиная с выбора правильного инструмента и заканчивая неконтролируемым ростом git-репозитория, вызванным хранением большого количества эталонных изображений. В докладе рассматриваются актуальные инструменты тестирования скриншотами, приводятся варианты решения возникающих при организации тестирования проблем.
Денис Измайлов, Axept
Последние 6 месяцев в глобальном JavaScript-сообществе очень много шума происходит вокруг библиотек CSS-in-JS. Это неудивительно. Высокая конкуренция на рынке повышает требования к качеству веб-приложений. Вместе с требованиями растёт и сложность. Разработчики начинают понимать, что CSS, включая SASS и CSS modules, и тот низкий уровень контроля над стилями, который они предоставляют, неприемлемы сегодня в разработке веб-приложений. При всём этом JavaScript успешно вышел за пределы браузера, оказавшись в мобильных, VR- и Desktop-приложениях.
В своём докладе Денис показал проблемы CSS и то, как JSS решает их. Но и JSS, в свою очередь, не лишён недостатков. Есть общие проблемы в решениях CSS-in-JS (включая React Native), такие, как сложность миграции, кривая обучения и отсутствие интеграции с CSS-экосистемой. Для решения всех этих проблем Денис со своей командой разработали PreJSS — инструмент, который, собрав best practices, медленно, но уверенно начал набирать популярность в мире.
Иван Лягушкин, Альфа-Лаборатория
Компонентный подход позволяет сильно упростить и ускорить разработку веб-приложений. React — прекрасный инструмент для создания библиотек компонентов, но он вводит свои ограничения, одно из них — каскадный рендер. Это ограничение особенно актуально при попытках создать универсальные всплывающие окна. Нам пришлось использовать несколько вспомогательных оберток, нестабильные методы библиотеки ReactDOM, контекст и здравый смысл, чтобы научить наши всплывающие окна отрисовываться в произвольные узлы DOM-дерева. Зато теперь у нас в библиотеке самые универсальные на свете попапы, тултипы, селекты и модальные окна.
Михаил Бусырев, Crazy Panda
Кроме проблемы корректной постановки бенчмарков, очень важным является дальнейшее наблюдение за производительностью приложения. Производительность может деградировать по многим причинам, часто напрямую не связанным с тем кодом, который замедлится. В докладе продемонстрировано, как заменой таргет-стандарта при транспилировании из TypeScript в es3 и es2016 можно получить радикально отличающуюся производительность не в пользу последнего стандарта. Для уверенности в том, что все применённые оптимизации работают на пользу, а рефакторинги и обновления не убивают производительность, необходимо относиться к бенчмарку как к интеграционному тесту производительности приложения в среде, приближенной к реальности настолько, насколько это в принципе возможно.
Все фото с мероприятия официальной группе Superjob IT-meetup
- WebGL
- ReactJS
- Node.JS
- JavaScript
- Блог компании Superjob.ru
В офисе Superjob состоялась встреча JavaScript-разработчиков MoscowJS. Рассказываем, что обсуждали участники, и делимся презентациями.
Александр Савин, Superjob
Трудно переоценить важность тестирования в процессе разработки. Тестирование интерфейсов скриншотами — один из подходов, который не только вовремя сигнализирует о регрессии в CSS, но и позволяет проводить рефакторинг шаблонов и стилей, не меняя тесты, упрощает процесс ревью. Однако при внедрении такого тестирования существует ряд типичных проблем, начиная с выбора правильного инструмента и заканчивая неконтролируемым ростом git-репозитория, вызванным хранением большого количества эталонных изображений. В докладе рассматриваются актуальные инструменты тестирования скриншотами, приводятся варианты решения возникающих при организации тестирования проблем.
Денис Измайлов, Axept
Последние 6 месяцев в глобальном JavaScript-сообществе очень много шума происходит вокруг библиотек CSS-in-JS. Это неудивительно. Высокая конкуренция на рынке повышает требования к качеству веб-приложений. Вместе с требованиями растёт и сложность. Разработчики начинают понимать, что CSS, включая SASS и CSS modules, и тот низкий уровень контроля над стилями, который они предоставляют, неприемлемы сегодня в разработке веб-приложений. При всём этом JavaScript успешно вышел за пределы браузера, оказавшись в мобильных, VR- и Desktop-приложениях.
В своём докладе Денис показал проблемы CSS и то, как JSS решает их. Но и JSS, в свою очередь, не лишён недостатков. Есть общие проблемы в решениях CSS-in-JS (включая React Native), такие, как сложность миграции, кривая обучения и отсутствие интеграции с CSS-экосистемой. Для решения всех этих проблем Денис со своей командой разработали PreJSS — инструмент, который, собрав best practices, медленно, но уверенно начал набирать популярность в мире.
Иван Лягушкин, Альфа-Лаборатория
Компонентный подход позволяет сильно упростить и ускорить разработку веб-приложений. React — прекрасный инструмент для создания библиотек компонентов, но он вводит свои ограничения, одно из них — каскадный рендер. Это ограничение особенно актуально при попытках создать универсальные всплывающие окна. Нам пришлось использовать несколько вспомогательных оберток, нестабильные методы библиотеки ReactDOM, контекст и здравый смысл, чтобы научить наши всплывающие окна отрисовываться в произвольные узлы DOM-дерева. Зато теперь у нас в библиотеке самые универсальные на свете попапы, тултипы, селекты и модальные окна.
Михаил Бусырев, Crazy Panda
Кроме проблемы корректной постановки бенчмарков, очень важным является дальнейшее наблюдение за производительностью приложения. Производительность может деградировать по многим причинам, часто напрямую не связанным с тем кодом, который замедлится. В докладе продемонстрировано, как заменой таргет-стандарта при транспилировании из TypeScript в es3 и es2016 можно получить радикально отличающуюся производительность не в пользу последнего стандарта. Для уверенности в том, что все применённые оптимизации работают на пользу, а рефакторинги и обновления не убивают производительность, необходимо относиться к бенчмарку как к интеграционному тесту производительности приложения в среде, приближенной к реальности настолько, насколько это в принципе возможно.
Все фото с мероприятия официальной группе Superjob IT-meetup