Это интервью было переиздано из Versioning , ежедневной подписной рассылки SitePoint, помогающей разработчикам оставаться в курсе и быть осведомленными, предлагая курированные ссылки на основные сведения о front-end, back-end, дизайне и UX, новостях, бизнесе и многом другом. Узнайте больше и зарегистрируйтесь здесь .
Тим Эвко (Tim Evko) — разработчик внешнего интерфейса, управляющий в основном базой кода React, и руководитель группы в ExecThread, компании, специализирующейся на поиске вакансий для профессионалов. Когда он не в ExecThread, он проводит остаток времени в местном спортзале, работая над тем, чтобы стать более конкурентоспособным спортсменом Crossfit.
Какая техническая идея или направление волнует вас больше всего на данный момент?
В последнее время я был очарован технологией Service Worker , особенно когда она использовалась, чтобы помочь сайтам загружаться быстро и становиться интерактивными. Мне нравится производительность и возможности автономных веб-приложений, и я думаю, что сообщество может извлечь выгоду из повышенного внимания к созданию гибких, универсальных и быстрых приложений.
Работникам сферы обслуживания особенно интересно работать из-за того, как много вы можете с ними сделать. Недавно я узнал, что вы можете использовать Service Worker для взаимодействия между вкладками в браузере, позволяя каждой отдельной вкладке перезагружаться, если кэш устарел. Это нелегкая технология, но я очень рад, что она есть!
Я не думаю, что слышал об этом раньше — не могли бы вы рассказать подробнее?
В браузере Service Workers контролируют всех клиентов, которые находятся в доступной области, а не только текущую активную вкладку. Это означает, что когда Service Worker взаимодействует с сайтом в вашем браузере, он все равно будет взаимодействовать со всеми вкладками, которые в данный момент отображают этот сайт. Вы можете воспользоваться этой функцией при использовании API postMessage, который поставляется вместе с Service Worker. Подробный пример этого можно найти здесь . В ExecThread мы используем эту функцию для перезагрузки всех вкладок в случае, если Service Service Worker отправляет старый файл CSS на страницу с новой разметкой.
Опишите (или ссылку на!) Что-то классное, что вы создали, спроектировали или произвели недавно. Почему ты гордишься этим?
Недавно я решил понять, как работают виртуальные алгоритмы DOM, и при этом создал свой собственный компонент рендеринга: BadDom [github]. Это 600 байт, и вы можете создать из него все свое веб-приложение. Я горжусь этим, потому что это 600 байт, и вы можете создать из него все свое веб-приложение.
BadDOM на самом деле очень прост, и вот что мне нравится в этом. Если вы дадите ему узел (например, div на странице) и строку шаблона ES6, он обновит первый div, чтобы он соответствовал строке шаблона. По сути, это DOM-diffring функция, которая гарантирует, что ее цель будет выглядеть как строка шаблона.
Однако, поскольку это шаблонная строка ES6, вы можете добавить логику в свои сравнения. Это означает, что вы можете вызывать функцию сравнения, когда вы обновляете любое состояние, на котором основана ваша логика, и ваша исходная цель DOM будет соответствовать новому состоянию. Все это работает путем создания невидимого элемента со строкой шаблона и сравнения целевого элемента (и его дочерних элементов), чтобы найти, удалить или изменить все узлы DOM, пока элемент на основе строки шаблона и целевой элемент не будут выглядеть одинаково.
Он эффективен, потому что никогда не обновляет элемент, который не нуждается в обновлении, тем самым предотвращая ненужную работу браузера. Если у вас есть 100 вложенных элементов, и на одном из них изменяется только одно имя класса, BadDom найдет один и только изменит класс.
Как ты это сделал?
Как и большинство моих проектов, я построил это на CodePen. Мне нравится сосредотачиваться на том, чтобы все было как можно проще, используя как можно меньше инструментов сборки / настройки. Таким образом, легче всего понять и внести свой вклад независимо от того, какие платформы или устройства они используют. CodePen великолепен, потому что мне не нужно настраивать IDE для работы с библиотеками Front End. Я мог бы целый день говорить о CodePen, его сообществе и о том, как много я узнал от других, которые работают над этим, но вместо этого я просто скажу, что каждый должен взглянуть на себя.
Мне нравится писать весь мой JavaScript, используя шаблон Module, который я сделал здесь. Шаблон модуля — это способ написать JavaScript, чтобы весь код находился внутри отдельного объекта. Методы внутри объекта хранятся в виде функций как свойств, а значения конфигурации могут храниться в виде объектов как свойств. Мне нравится использовать этот шаблон из-за того, как легко организовать код (особенно библиотеки). Вы можете найти больше о шаблоне здесь .
Какую лучшую технику ты недавно прочитал и почему?
Эластичный веб-дизайн Джереми Кейта — Джереми — отличный автор, и эта книга написана так, как написано в коде книги.
Какая была самая смешная или интересная не по теме ссылка, которую вы недавно отправили другу?
На восточном побережье США это как-то ЕЩЕ зима. Я отправил это своей жене на днях:
Это действительно хорошо! На этой неделе есть интервью, благодаря Тиму, который поделился технологией, которой он больше всего увлечен.
