Стачка.Frontend

JavaScript развивается и уже стал одной из самых популярных технологий программирования: с его помощью пишутся сервера, мобильные и десктопные приложения. Секция будет посвящена актуальным технологиям из мира Frontend и развитию frontend-экосистемы в целом

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

Подать доклад


Максим Сальников
Developer Engagement Lead @ Microsoft
Oslo
Фоновые сервисы в браузерах - есть ли жизнь после закрытия вкладки?

Доклад принят в программу конференции


из Доклады

    Пользователь закрывает вкладку в браузере, и ваше замечательное фронтенд-приложение испаряется. А что если можно было бы оставить какие-то его части еще немного поработать во благо улучшения UX? Отреагировать на какие-то события, завершить начатое общение с сетью - в общем, исполнить немного кода при закрытой вкладке и даже браузере. Я расскажу о разных интересных возможностях API из семейства сервис-воркеров, позволяющих продлить жизнь приложения, чтобы всегда иметь под рукой свежие данные, не бояться проблем с сетью, уметь показывать уведомления - все ради отличного пользовательского опыта.


    Павел Черторогов
    Архитектор информационных систем @ ps.kz
    Алматы
    ApolloClient, graphql-codegen и кодогенерация типизированных hook'ов

    Доклад принят в программу конференции


    из Доклады

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

      Многим фронтендерам не нравиться писать типы, многие ошибаются при их написании и использовании. Разработчиков понять можно. По большому счёту, статическая типизация нужна машинам, так почему бы машинам самим её не писать?!

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


      Серёжа Попов
      CEO, CTO (Talant) @ Лига А. / HTML Academy
      Санкт-Петербург
      Про Lighthouse

      Доклад принят в программу конференции


      из Доклады

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


        Полина Гуртовая
        Frontend @ Evil Martians
        Москва
        WebAssembly: новые возможности и новые проблемы

        Доклад принят в программу конференции


        из Доклады

          В докладе мы разберемся что же такое WebAssembly.

          Поговорим о WebAssembly как о формате, не привязанном к web, обсудим как WebAssembly живет в браузерах.

          На примере V8 разберемся как выполняется JS и WASM.

          Попробуем понять что влияет на скорость выполнения JS и WASM и в каких случаях WASM оказывается быстрее.

          И наконец обсудим текущий статус технологии и возможности ее применения.


          Алексей Гусев
          Старший разработчик интерфейсов @ Яндекс
          Москва
          Минифицируем приватные поля в TypeScript

          Доклад принят в программу конференции


          из Доклады

            Этот доклад о том, как я делал небольшую оптимизацию размера бандла, подсмотренную в Google Closure Compiler — минификацию приватных полей. Расскажу об использовании babel-плагинов, трансформеров TypeScript и насколько в итоге получилось уменьшить размер production-сборки проекта.

            Доклад будет полезен разработчикам, которые ищут дополнительные способы оптимизации своего кода и хотят узнать о том, как webpack, Babel и TypeScript могут в этом помочь.


            Aleksandr Pushkin
            frontend developer @ Miro
            Пермь
            Типизировать сроку, нельзя опускать типизацию

            Доклад принят в программу конференции


            из Доклады

              Расскажу про реальную проблему, как вывести типизацию из строки. Расскажу с какими проблемами в TS пришлось столкнуться и как их удалось обойти.


              Олег Коровин
              Ведущий фронтенд-разработчик @ Одноклассники
              Санкт-Петербург
              Переход на реакт как дорога в Ад

              Доклад принят в программу конференции


              из Доклады

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

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

                Эта история весьма поучительна, потому что в крупных системах не всегда так важно, что думает разработчик, потому что последнее слово всегда за пользователем. Об этом мы и поговорим подробно в докладе.


                Павел Смирнов
                Разработчик интерфейсов @ Яндекс.Маркет
                Москва
                Фронтенд без границ. По ту сторону API

                Доклад принят в программу конференции


                из Доклады

                  Сегодня фронтенд-разаработчик занимается огромным списком задач: верстает, разрабатывает дизайн-системы, кодит на JS, спорит о типизации, выбирает лучший фреймворк. Но мы в Яндекс.Маркете пошли дальше и решили ещё писать серверный API для мобильного приложения силами команды разработки интерфейсов. Почему мы так поступили? Что из этого вышло? Стоит ли вам поступить так же? Ответы на эти и другие вопросы в моём докладе.


                  Григорий Бизюкин
                  Разработчик интерфейсов @ Яндекс
                  Москва
                  Concurrent Mode: монтируй, конкурируй, обновляй

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Конкурентный режим в React — многообещающая возможность перерисовывать и исполнять компоненты асинхронно. Но, насколько это сильное преимущество? Для каких задач он подойдет в первую очередь? И, неужели, весь проект снова придется переписать? Это и многое другое узнаем в докладе!


                  Дмитрий Ивко
                  Lead Front-end @ altarix
                  Самара
                  Большие таблицы или как победить “Годзиллу”

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Проблема больших таблиц

                  Критерии выбора решений

                  Сравнение существующих решений

                  Оптимизация и ньюансы работы с готовыми решениями


                  Дмитрий Ивко
                  Lead Front-end @ altarix
                  Самара
                  Сравнение фронтовых инструментов для реализации проектов или как не стрелять из пушки по воробьям

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Перечень типовых задач

                  Плюсы и минусы angular, react, vue

                  Сравнение технологий

                  Опыт что для чего лучше подходит.


                  Дмитрий Ивко
                  Lead Front-end @ altarix
                  Самара
                  С чего лучше начать проект или как сделать так, что бы не было потом мучительно больно

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Как определить тип проекта

                  Муки выбора технологий

                  Определения рисков

                  Как сделать так что бы вас потом не проклина


                  Sergey Rozhkov
                  software engineer @ Andersen
                  Minsk
                  New Adventures in Front-End

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Состояние JS в 2020, новые тренды, пробитое дно. Что стоит попробовать, от чего стоит отказаться. Большинство проектов это монстры застывшие после релиза. Когда вы оптимизировали свой код последний раз? Знаете что такое PWA/TWA? Ваше приложение работает в оффлайне?


                  Семен Левенсон
                  Frontend team lead @ Хантфлоу
                  Москва
                  Это я! Или авторизация в 2020

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Аутентификация, авторизация... в этих терминах люди часто путаются. Мы поговорим про первое - какие способы аутентификация есть. И какие интересные решения сегодня есть для ее реализации


                  Aleksandr Pushkin
                  frontend developer @ Miro
                  Пермь
                  Typescript, сохрани и спаси мою логику.

                  Программный комитет не принял решения по этому докладу


                  из Голосование

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


                  Олег Коровин
                  Ведущий фронтенд-разработчик @ Одноклассники
                  Санкт-Петербург
                  Дикие истории

                  Программный комитет не принял решения по этому докладу


                  из Голосование

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

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


                  Григорий Бизюкин
                  Разработчик интерфейсов @ Яндекс
                  Москва
                  Каррируй, композируй, очищай

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Функциональное программирование — сложная штука, но мы будет говорить про него так, что поймет даже ваша бабушка. Рассмотрим самые важные и прикладные штуки и разберемся, действительно ли, функциональное программирование поможет сделать JavaScript разработку проще?


                  Sergey Rozhkov
                  software engineer @ Andersen
                  Minsk
                  Слышали про PWA? Внедряем здесь и сейчас!

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Понятие Progressive Web Applications на слуху. Термит придуман в 2015, получил развитие 2018, поддержку в 2019. Активно поддерживается Google, PWA пользуют известные компании, например, Uber, Tinder, Twitter и другие. С весны 2018 года приложения этого класса поддерживаются всеми основными браузерами, однако распространенность технологий PWA несмотря на очевидные их «плюсы» пока очень низка. Так чего же мы ждём? Давайте разберемся что это, как это работает и давайте внедрять! Это модно, современно и очень интересно.


                  Игорь Яковлев
                  Генеральный директор @ AFFINAGE
                  Москва
                  Что такое дизайн на самом деле?

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Если раньше многие вкладывали и инвестировали в крутых и модных дизайнеров, то сейчас спрос идет на frontend-разработчиков. Границы дизайна и верстки стираются с каждым обновлением инструментария, с каждым самописным плагином, с каждым стайл-гайдом. Что произойдёт если вы будете брать крутых фронтов, как если бы вы брали крутых дизайнеров? Современный frontend-разработчик должен выйти за рамки написания качественного кода на проектах. О том как мы в AFFINAGE стираем границы дизайна и верстки семимильными шагами, какими навыками обладает мощный фронтендер, что такое дизайн глазами frontend-разработчика, почему наши верстальщики работают в figma/adobe xd и учат дизайнеров работать, и что из этого вышло? Ответы на эти вопросы вы узнаете из моего доклада.


                  Борис Гулай
                  Разработчик @ Додо Пицца
                  Москва
                  Додо Пицца: собственная касса на веб-технологиях

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Зачем что-то менять, когда у тебя есть традиционное веб-приложение со всеми его плюсами: прозрачное обновление, работа на любой ОС лишь бы в приличном браузере, простота разработки, дизайна и деплоя? Незачем — до того момента, когда тебе нужно взаимодействовать с оборудованием. Сделать это из песочницы, в которой работает приложение в браузере, затруднительно. Для того и создавалась песочница, чтобы защитить локальный компьютер от поползновений веб-сайтов. Что ещё хуже, есть устойчивая тенденция на ужесточение ограничений песочницы.

                  Мы столкнулись с этой историей, когда разрабатывали кассу. Для преодоления вышеописанных ограничений мы использовали ActiveX. По сути, IE остался единственным браузером, допускающим прямой доступ к локальному компьютеру через проприетарную технологию COM. Это создавало множество проблем: ограничение по поддерживаемым ОС, длительная настройка браузера, неожиданные проблемы на клиентской стороне и тому подобное.

                  В докладе я расскажу про решение, которое спасло нас: Electron = Chrome + NodeJS. Оно требует установки на рабочие места, но даёт современный браузер и возможность выполнять код за пределами песочницы (благодаря NodeJS). Кроме того, позволяет приблизить UX к типичному десктопному. Сохраняя при этом большинство плюсов веб-приложения.


                  Иван Дмитрачков
                  Программист-разработчик фронтенд @ АИС МЕДИА
                  Москва
                  Headless CMS в качестве API для лендинга на React

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  Познакомимся с пятью популярными Headless CMS с открытым исходным кодом. Рассмотрим, как управлять контентом, формировать API. Интегрируем API с типовым сайтом на React. Сделаем выводы о сильных и слабых сторонах Headless CMS.


                  Секреты Mavo. Решение повседневных задач веб-разработчика без JavaScript

                  Программный комитет не принял решения по этому докладу


                  из Голосование

                  За годы своего существования (а это почти 30 лет) язык HTML зарекомендовал себя как исключительно дружелюбный язык, легко осваиваемый новичками. А в сочетании с CSS он позволяет достичь каких-то невероятных высот. Взять, к примеру, игру Mario Kart, написанную на чистом HTML и CSS.

                  Однако, есть задачи, с которыми HTML, даже в сочетании с CSS, пока справиться не может.

                  Что если бы мы могли писать веб-приложения на языке HTML без привлечения JavaScript? Что если бы у нас был столь же дружелюбный и простой в изучении инструмент, который позволил расширить возможности HTML и при этом не потерять его сильные стороны чрезмерным усложнением?

                  И такой инструмент есть. Это Mavo — будущее HTML в настоящем!

                  Mavo разрабатывается в Массачусетском технологическом институте (MIT) под руководством Лии Веру (Lea Verou).

                  В рамках доклада мы познакомимся с Mavo и на нескольких примерах увидим красоту и мощь этого великолепного инструмента.