- PVSM.RU - https://www.pvsm.ru -

Фронтенд наносит ответный удар: топ-10 (?) докладов HolyJS 2018 Piter

Фронтенд наносит ответный удар: топ-10 (?) докладов HolyJS 2018 Piter - 1

Привет! Мы уже выложили на YouTube видеозаписи докладов HolyJS 2018 Piter, а для вас сделали (не совсем) традиционную подборку самых лучших из них по мнению посетителей конференции.

Как обычно, наверху «младшие» доклады, в конце — с самым высоким рейтингом. Конечно, это не значит, что один доклад намного хуже другого: оценки всей подборки в диапазоне от 4,28 до 4,56. Если посмотреть число отзывов, или поменять методику расчета, места могут легко поменяться. В общем, смотрите всё!

Под катом — и видеозаписи лучших докладов, и ссылки на их презентации, и короткие описания, и ссылка на полный плейлист.

Системный подход к скорости во фронтенде: онлайн-измерения

Спикер: Андрей Прокопюк
Место: 11
Рейтинг: 4,28 ± 0,08
Презентация доклада [1]

Сюрприз! Сегодня у нас не 10, а 11 докладов, и на это есть несколько причин.

Во-первых, между 11-м и 10-м местом разница всего в четыре сотых балла. Во-вторых, изначально ребята из «группы скорости Яндекса» планировали сделать парный доклад, а затем разделились: Андрей (Andre_487 [2]) рассказал про онлайн-, а Алексей про оффлайн-измерения. Так что для полноты картины включили в топ оба: можно считать их двумя частями единого целого.

Это отличный доклад для начала нашей подборки — он простой, динамичный, но в то же время полезный. Он поможет придумать метрики и разобраться в быстродействии продукта, сделав какие-то вещи буквально на коленке и без лишней аналитики.

Как выразился один из посетителей конференции: «CI на стероидах у этих парней!».


Bringing mobile web back to life

Спикер: Imad Elyafi
Место: 10
Рейтинг: 4,28 ± 0,12
Презентация доклада [3]

Доклад Имада из Pinterest о том, как за 11 недель (успешно!) переписать мобильную веб-версию такого крупного проекта, как Pinterest, получив рост метрик вовлеченности пользователей. Итог — результат близок к нативным приложениям без потери в скорости нагрузки.

Конечно, путь был тернист и непрост — Имад на примерах рассказывает, где им приходилось сталкиваться с проблемами, и каким образом их удавалось решать. Он пояснит, почему команда выбрала именно мобильную версию, о работе над стартовой страницей и том, как сайт оптимизировали под 3G-соединение без потери синхронизации.


Отладка JS на примере Chrome DevTools

Спикер: Алексей Козятинский
Место: 9
Рейтинг: 4,28 ± 0,08
Презентация доклада [4]

Основная тема доклада — что находится внутри отладчика web-приложений. Алексей работает «по ту сторону баррикад» — в команде Chrome DevTools, создавая и улучшая там инструменты для отладки JavaScript. В докладе пойдёт речь как раз об этом: что браузер может делать автоматически при отладке, какие инструменты являются друзьями разработчика, как работать с асинхронными стеками и профилированием памяти.

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

Доклад короткий, но подробный: в нём много разборов инструментов, много кода и обещаний починить баги :)


Системный подход к скорости во фронтенде: оффлайн-измерения

Спикер: Алексей Калмаков
Место: 8
Рейтинг: 4,29 ± 0,08
Презентация доклада [5]

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

Алексей вскрывает плюсы и минусы подхода своего коллеги, и рассказывает о грустную историю одного релиза, об инструменте Pulse, который помогает собирать данные и запросы и выделяет основные проблемы сбора данных в оффлайне. Лёгкий, весёлый и полезный доклад.


Кейноут: 30: слишком много JavaScript

Спикер: Илья Климов
Место: 7
Рейтинг: 4,30 ± 0,08
Презентация доклада [6]

Завершающий мотивационный кейноут получился очень «лёгким», живым, и довольно юмористическим. Как минимум, его стоит посмотреть ради раздела про категоризацию обучения. Илья составил ёмкий график важности и актуальности знаний, который очень понравился нашим слушателям.

Этот доклад — ответ на три вопроса, которые задают Илье каждую неделю по несколько раз его студенты:

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

Кейноут: Мерцание технологий, или Инжиниринг 21-го века

Спикер: Максим Юзва
Место: 6
Рейтинг: 4,41 ± 0,07
Презентация доклада [7]

Если код не спорит, не задаёт лишних вопросов (ну, почти), и с ним не нужно вести переговоры, то вот с людьми всё куда сложнее — у каждого свои причуды, потребности и так далее. Об этом — доклад Максима в стиле TED, ставший завершением первого дня.

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

Максим учит продавать рефакторинг на проекте, убеждать коллег внедрить Линтер и перестать париться, на чём писать, Angular, React или Vue.

Этот доклад ответит на вопрос: «Смог бы Илон Маск запустить и посадить ракету, если бы лучше всех в мире знал JavaScript, React или Angular?» Спойлер: «Да. Но знание js здесь не главное». Ведь нужно качать софтскилз, уметь общаться в команде, доказывать свою точку зрения и многое другое. Можно идеально писать код, но проиграть в обсуждении тому, у кого хорошо повешен язык. И об этом нужно помнить.


Декомпозиция Main Thread в Node.js для увеличения пропускной способности

Спикер: Николай Матвиенко
Место: 5
Рейтинг: 4,42 ± 0,09
Презентация доклада [8]

Каждая компания использует Node.js по-своему: от сборки стилей, SSR и шаблонизации до микросервисов и общения с базами данных. Но всех объединяет одно — загруженный Main Thread. Николай на примере внедрения Node.js в крупных enterprise e-commerce проектах рассказывает, как качественно и постепенно разгрузить Main Thread так, чтобы повысить пропускную способность.

Инструментов для этого множество — вынесение логирования в отдельный поток, сбор метрик в отдельный процесс, запуске worker’ов для работы с самыми ресурсоёмкими задачами.

Тесты, конкретные цифры сравнения, графики — каждый инструмент Николай разбирает подробно и с умом. Харкорный, но очень полезный доклад, который не рекомендуется пропускать.


Работаем с абстрактными синтаксическими деревьями JavaScript

Спикер: Кирилл Черкашин
Место: 4
Рейтинг: 4,44 ± 0,07
Презентация доклада [9]

Кирилл, родившийся в Москве, сейчас живёт в Нью-Йорке и работает в Google над Firebase, а также организует [10] крупнейший Angular-митап в мире. Он рассказывает на простых и «болевых» примерах о том, как грамотно анализировать свой код и трансформировать чужой.

Зачем же нужно парсить свой код? К примеру, для того, чтобы найти забытый console.log перед коммитом. А что делать, если вам надо поменять сигнатуру функции в сотнях вхождений в коде? Справятся ли тут регулярные выражения?

На все эти вопросы отвечает Кирилл в своём простом, но очень полезном докладе. Он исследует подходы к анализу и преобразованию исходного JavaScript-кода, основанные на его парсинге и работе с получающимися Abstract Syntax Tree. В качестве примеров используются Babel и ESLint.


EME? CDM? DRM? CENC? IDK!

Спикер: Sebastian Golasch
Место: 3
Рейтинг: 4,46 ± 0,17

Презентация доклада [11]

Доклад в трёх словах — реверс-инжиниринг Netflix!
Очень интересный доклад, который раскрывает технические детали, стоящие за целым рядом страшных аббревиатур DRM-стэка: EME (Encrypted Media Extension), CDM (Content Decryption Modules), Widevine, и DRM (Digital Rights Management).

За один доклад Себастьян пройдётся по основным моментам, связанным с защитой онлайн-видео: стриминге, скачивании, защите от пиратства, лицензировании и многим другим. Он расскажет, как создать собственный видеоплеер для Netflix и углубится в архитектуру сервиса.

Насыщенный техническими деталями доклад, который, может, и не подойдёт каждому, но либо введёт в азы работы с DRM, либо подскажет что-то полезное тем, кто каждый день сталкивается с работой стриминговых сервисов.


Dirty little tricks from the dark corners of eCommerce

Спикер: Виталий Фридман
Место: 2
Рейтинг: 4,51 ± 0,11
Презентация доклада [12]

Виталий — человек, который рассказывает просто о важном. К примеру, о том, что может пойти не так в eCommerce-проекте.

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

В докладе Виталий показывает огромное количество примеров того, как в eCommerce делают плохо (для конверсии или по отношению к пользователям), с реальными примерами и фирменным юмором.

В этом докладе Виталий рассмотрит, как можно повысить конверсию, а также просто улучшить впечатления пользователя с помощью некоторых мелочей. Как обычно — доклад Виталия красив, прост (несмотря на английскую речь), и очень полезен как UX-дизайнерам, так и разработчикам.

Множество положительных отзывов от посетителей говорят одно — каждый слушатель и зритель найдёт для себя в докладе Виталия что-то полезное для работы.


Кейноут: New adventures in frontend, Season 2

Спикер: Виталий Фридман
Место: 1
Рейтинг: 4,56 ± 0,05
Презентация доклада [13]

«А вот и не угадал, у меня жужжит в обоих ухах!» В общем, если из-за открывающей картинки поста вы пробовали угадать место Виталия Фридмана, то вряд ли догадались, что он ухитрился занять две верхних позиции сразу.

Если одним из самых заметных выступлений предыдущей HolyJS стал доклад [14] Виталия Фридмана «New Adventures in Responsive Web Design», то его «сиквел» стал лучшим на HolyJS Piter 2018!

Когда возглавляешь Smashing Magazine, узнаешь массу фронтендерских тонкостей, сложностей и грязных трюков — так что доклад затронет самые разные темы. Как предупреждает автор, «вы не сможете «раззнать обратно» то, что узнаете, и мы не несем ответственность за ваши последующие ночные кошмары». Как сказал один из слушателей: «акробатические трюки для оптимизации работы фронтенда всегда пригодятся!». Не можем не согласиться.

Если эти доклады (и другие из полного плейлиста [15]) заинтересовали, обращаем внимание: 24-25 ноября состоится HolyJS Moscow 2018 [16].

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

Автор: phillennium

Источник [17]


Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/javascript/297350

Ссылки в тексте:

[1] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/5JoTEYnAGIGSY8YYyWkMyu/483f47ff09102e02fc4c174e617743bb/Andrey_Prokopyuk_Velocity_Online_Measurements.pdf

[2] Andre_487: https://habr.com/users/andre_487/

[3] Презентация доклада: https://downloads.ctfassets.net/nn534z2fqr9f/6LFlknbgTCgSW62oI62oOk/65402561639582669a23c372a183435b/Imad_Elyafi_Bringing_Mobile_Web_Back_to_Life.pdf

[4] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/4xMrdqUlTGsua0QwUig0QS/386536648d0bd671ee4894eb4e6cec34/Aleksey_Kozyatinskiy_JavaScript_debugger.pdf

[5] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/gYzskQG7cIMEcwq4qU6MS/6a16289ec84f6b22298e7450e32bc045/Alexey_Kalmakov_offline_measurements.pdf

[6] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/5atzdSm2BaQiiE4K8YSkyk/0223bac6e570274836e9b47ac9d148c9/Illya_Klymov_30_2.pdf

[7] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/3t7RLg6CIg0w8k6myekMwu/8a9832d378568ebe478c6c8b9b6ed084/Yuzva_technology_flashing_.pdf

[8] Презентация доклада: https://assets.ctfassets.net/nn534z2fqr9f/3xtKFHSuissgAqMIMmaQ4w/52e391982259a4244a231cb8a5460dc6/Nikolay_Matvienko_Decomposition_of_the_Main_Thread.pdf

[9] Презентация доклада: https://codelab.fun/ast/intro

[10] организует: https://www.meetup.com/ru-RU/AngularNYC/members/14429094/

[11] Презентация доклада: https://downloads.ctfassets.net/nn534z2fqr9f/3cee4odqrCyuUqm6YYC8Ga/bf153bf0e98e15307326ecfbe225994f/Sebastian_Golasch_-_EME__CDM__DRM__CENC__IDK_.pdf

[12] Презентация доклада: https://downloads.ctfassets.net/nn534z2fqr9f/2sw2xzK7c8qeW4UeW6ugsC/c12e156572aaf355308dcd5d0a89e3f8/holy-dirty-little-tricks.pdf

[13] Презентация доклада: https://downloads.ctfassets.net/nn534z2fqr9f/258nBVG8gIoqgU6Gc2ymGQ/321f64509d556f34ebc8a050e1b90891/holyjs-opening.pdf

[14] доклад: https://www.youtube.com/watch?v=rgHLV2fe-2I

[15] полного плейлиста: https://www.youtube.com/playlist?list=PL8sJahqnzh8KeXLLPIasdrnqMy-JkTGVM

[16] HolyJS Moscow 2018: https://holyjs-moscow.ru/

[17] Источник: https://habr.com/post/428085/?utm_campaign=428085