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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019) - 1

Медиа [1]    |    Веб-разработка [2]    |    CSS [3]    |    JavaScript [4]    |    Браузеры [5]    |    Занимательное [6]    |    

Медиа

podcast Подкаст «UnderJS» #5 — Разговор с Романом Дворновым про Open-Source и вкусные детали Web [Ламповый] [7]
podcast Подкаст «Сделайте мне красиво», Выпуск №25, в гостях Юрий Цуканов — Конкуренция, плохие способы учить язык и полезные ссылки [8]
podcast Девшахта-подкаст #95: Зачем проводить конференцию на английском языке [9]
podcast Подкаст «Фронтенд Юность (18+)» #109 Продаём технические долги коллекторам Pro Unlimited [10]
podcast en Подкаст «Веб-стандарты» — 194. Eric Meyer and Max Böck on HTML, CSS, and Web standards [11]
video «Как я стал Front-end разработчиком». Евгений Ковальчук на канале webDev [12]
video FrontSpot Show #12: Сергей Рубанов про будущее JS, секреты платного опенсорса, тонкостях BeerJS. [13]
video Repozitorro #28 — Достойное портфолио верстальщика [14]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019) - 11 Веб-разработка

habr 5G — технология, которая, видимо, замедлит веб [15]
habr Drag-&-Drop компоненты для слепых пользователей? Вы шутите? [16]
habr Сервис-воркеры в клиенте Slack: об ускорении загрузки и оффлайн-режиме [17]
Как правильно “делать” семантику [18]
Полное руководство по отзывчивым изображениям! [19]
en Переход в оффлайн с микроформатами [20]
en Дополнительные параметры, помогающие веб-сайтам делать превью их контента в поиске Google [21]
en Вам действительно нужен PWA? Четыре вопроса, которые помогут вам определиться [22]
en Франкенштейн-миграция: подход, не зависящий от фреймворка: часть 1 [23], часть 2 [24]
en Почему прогрессивные веб-приложения — это будущее мобильного Интернета? [25]
en Руководство по реализации темных режимов на сайтах [26]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019) - 30 CSS

habr Заходят как-то два браузера в скроллбар… [36]
habr Где и как использовать колоночный макет (CSS Columns) [37]
Защита Email от Spamer’ов на CSS [38]
en Использование Google API для доступа к вариативным шрифтам. [39]
en Более умные пользовательские свойства с новым API Houdini [40]
en Как CSS Grid меняет наше представление о структурировании контента [41]

JavaScript

habr История и наследие jQuery [42]
habr Боль и слёзы в Svelte 3 [43]
Руководство по обработке ошибок в JavaScript [44]
Выход за пределы console.log() – 8 console методов, которые следует использовать при отладке JavaScript и Node [45]
en JavaScript в 3D: введение в Three.js [46]
en Новые и потенциальные функции JavaScript ES2019, которые порадуют каждого разработчика [47]
en 6 вещей, которые вы, вероятно, не знали, что javascript может делать нативно [48]
en Фильтрация данных на стороне клиента: сравнение CSS, jQuery и React [49]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019) - 64 Браузеры

habr Как рисует браузер. Доклад Яндекса [70]
Microsoft портирует браузер Edge на Linux [71]
Google, Mozilla и Cloudflare начали поддерживать протокол HTTP/3 [72]
Mac перестали загружаться из-за обновления Google Chrome [73]
en Как сделать скриншот сайта с высоким DPI в Firefox [74]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №382 (22 — 29 сентября 2019) - 67 Занимательное

habr CloudFlare запустил бесплатный VPN — без регистрации (и SMS) [75]
GitHub открыл наработки по применению машинного обучения для поиска и анализа кода [76]
Продали технологии в Snap и набрали популярность на функции «какая ты знаменитость»: кто разработал приложение Gradient Материал редакции [77]
Yahoo сменила логотип и провела ребрендинг [78]
GitHub запускает свои щупальца в CI/CD и менеджмент артефактов [79]
Почему разработчики так любят тёмную тему [80]

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.

Дайджест за прошлую неделю [81].
Материал подготовили dersmoll [82] и alekskorovin [83].

Автор: alexzfort

Источник [84]


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

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

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

[1] Медиа: #media

[2] Веб-разработка: #development

[3] CSS: #css

[4] JavaScript: #js

[5] Браузеры: #browser

[6] Занимательное: #interesting

[7] Подкаст «UnderJS» #5 — Разговор с Романом Дворновым про Open-Source и вкусные детали Web [Ламповый]: https://underjs.ru/podcast/2019/09/24/open-source-and-web-delicious.html

[8] Подкаст «Сделайте мне красиво», Выпуск №25, в гостях Юрий Цуканов — Конкуренция, плохие способы учить язык и полезные ссылки: https://soundcloud.com/begebot/ep25

[9] Девшахта-подкаст #95: Зачем проводить конференцию на английском языке: https://medium.com/devschacht/devschacht-95-fb973bfab049

[10] Подкаст «Фронтенд Юность (18+)» #109 Продаём технические долги коллекторам Pro Unlimited: https://soundcloud.com/frontend_u/e109

[11] Подкаст «Веб-стандарты» — 194. Eric Meyer and Max Böck on HTML, CSS, and Web standards: https://medium.com/web-standards/episode-194-1b738288c6ba

[12] «Как я стал Front-end разработчиком». Евгений Ковальчук на канале webDev: https://www.youtube.com/watch?v=Tu_6y6kU2yE

[13] FrontSpot Show #12: Сергей Рубанов про будущее JS, секреты платного опенсорса, тонкостях BeerJS. : https://www.youtube.com/watch?v=4mSv4I3_Phg

[14] Repozitorro #28 — Достойное портфолио верстальщика: https://www.youtube.com/watch?v=39Au5hMn_xc

[15] 5G — технология, которая, видимо, замедлит веб: https://habr.com/ru/company/ruvds/blog/468407/

[16] Drag-&-Drop компоненты для слепых пользователей? Вы шутите?: https://habr.com/ru/company/oleg-bunin/blog/468541/

[17] Сервис-воркеры в клиенте Slack: об ускорении загрузки и оффлайн-режиме: https://habr.com/ru/company/ruvds/blog/468409/

[18] Как правильно “делать” семантику: https://medium.com/@niktariy/%D0%BA%D0%B0%D0%BA-%D0%BF%D1%80%D0%B0%D0%B2%D0%B8%D0%BB%D1%8C%D0%BD%D0%BE-%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C-%D1%81%D0%B5%D0%BC%D0%B0%D0%BD%D1%82%D0%B8%D0%BA%D1%83-c6c20f26b776

[19] Полное руководство по отзывчивым изображениям!: https://www.notion.so/b5c7c2ad93f840db82a2c353251411cb

[20] Переход в оффлайн с микроформатами: https://adactio.com/journal/15844

[21] Дополнительные параметры, помогающие веб-сайтам делать превью их контента в поиске Google: https://webmasters.googleblog.com/2019/09/more-controls-on-search.html

[22] Вам действительно нужен PWA? Четыре вопроса, которые помогут вам определиться: https://www.freecodecamp.org/news/four-questions-to-understand-if-you-need-pwa/

[23] часть 1: https://www.smashingmagazine.com/2019/09/frankenstein-migration-framework-agnostic-approach-part-1/

[24] часть 2: https://www.smashingmagazine.com/2019/09/frankenstein-migration-framework-agnostic-approach-part-2/

[25] Почему прогрессивные веб-приложения — это будущее мобильного Интернета? : https://ymedialabs.com/progressive-web-apps

[26] Руководство по реализации темных режимов на сайтах: https://www.kooslooijesteijn.net/blog/add-dark-mode-to-website?ref=heydesigner

[27] Запуск Lighthouse в CI с использованием Github Actions: https://github.com/treosh/lighthouse-ci-action

[28] Размеры изображения и видео для социальных сетей.: https://socialsizes.io/

[29] navi — интерактивный инструмент с подсказками для командной строки: https://github.com/denisidoro/navi

[30] image-actions — автоматически сжимает jpeg, png и webp изображения в пулреквестах на GitHub: https://github.com/marketplace/actions/image-actions

[31] Ускорение instagram.com. Часть 1: https://habr.com/ru/company/ruvds/blog/468227/

[32] Технологии Яндекс Турбо-страницы и Google AMP для e-commerce: https://habr.com/ru/post/468811/

[33] Исследование производительности анимации с DevTools: https://calibreapp.com/blog/investigate-animation-performance-with-devtools/

[34] Показатели производительности для невероятно быстрых веб-приложений : https://blog.superhuman.com/performance-metrics-for-blazingly-fast-web-apps-ec12efa26bcb

[35] Подходящие ли сейчас время выбрать AMP?: https://www.webdesignerdepot.com/2019/09/is-it-time-to-embrace-amp/

[36] Заходят как-то два браузера в скроллбар…: https://habr.com/ru/company/ruvds/blog/468405/

[37] Где и как использовать колоночный макет (CSS Columns): https://habr.com/ru/post/469395/

[38] Защита Email от Spamer’ов на CSS: https://medium.com/@frontman/%D0%B7%D0%B0%D1%89%D0%B8%D1%82%D0%B0-email-%D0%BE%D1%82-spamer%D0%BE%D0%B2-%D0%BD%D0%B0-css-46fbaaf9c2a0

[39] Использование Google API для доступа к вариативным шрифтам.: https://variablefonts.dev/posts/fira-code-google-api-demo/

[40] Более умные пользовательские свойства с новым API Houdini : https://web.dev/css-props-and-vals

[41] Как CSS Grid меняет наше представление о структурировании контента : https://www.freecodecamp.org/news/css-grid-changes-how-we-can-think-about-structuring-our-content/

[42] История и наследие jQuery: https://habr.com/ru/company/mailru/blog/468169/

[43] Боль и слёзы в Svelte 3: https://habr.com/ru/post/469361/

[44] Руководство по обработке ошибок в JavaScript: https://dailycoding.io/article/EEw4zMC2gRgUMXp6CUpN

[45] Выход за пределы console.log() – 8 console методов, которые следует использовать при отладке JavaScript и Node: https://webdevblog.ru/vyhod-za-predely-console-log-8-console-metodov-kotorye-sleduet-ispolzovat-pri-otladke-javascript-i-node/

[46] JavaScript в 3D: введение в Three.js: https://medium.com/@bretcameron/javascript-in-3d-an-introduction-to-three-js-780f1e4a2e6d

[47] Новые и потенциальные функции JavaScript ES2019, которые порадуют каждого разработчика: https://blog.logrocket.com/new-es2019-javascript-features-every-developer-should-be-excited-about/

[48] 6 вещей, которые вы, вероятно, не знали, что javascript может делать нативно: https://enmascript.com/articles/2019/09/24/6-things-you-probably-did-not-know-javascript-could-do-natively

[49] Фильтрация данных на стороне клиента: сравнение CSS, jQuery и React: https://css-tricks.com/filtering-data-client-side-comparing-css-jquery-and-react/

[50] Объединение стилей с помощью JavaScript Proxy: https://tobiasahlin.com/blog/chaining-styles-with-proxy/

[51] Объяснение того, как работает Intersection Observer : https://css-tricks.com/an-explanation-of-how-the-intersection-observer-watches/

[52] Странный мир Infinity в JavaScript : https://www.impressivewebs.com/infinity-in-javascript/

[53] Мышление в парадигме React Hooks: https://wattenberger.com/blog/react-hooks

[54] Конечные автоматы в React: https://www.telerik.com/blogs/finite-state-machines-in-react

[55] Как решить проблему Render Props Callback Hell: https://dmitripavlutin.com/solve-react-render-props-callback-hell/

[56] React & SEO: разработка SPA на Next.js, оптимизированного для Google: https://snipcart.com/blog/react-seo-nextjs-tutorial

[57] Рекурсия в React: рендер комментариев с вложенным дочерними элементами: https://coderrocketfuel.com/article/recursion-in-react-render-comments-with-nested-children

[58] Как структурировать ваш Vue проект для долгосрочной перспективы: https://medium.com/glovo-engineering/how-to-structure-your-vue-project-for-the-long-term-657817a2a002

[59] 15 директив Vue, которые значительно увеличат вашу производительность: https://www.telerik.com/blogs/15-must-have-vue-directives-that-will-significantly-maximize-your-productivity

[60] Создание расширений Chrome с помощью Vue.js: https://medium.com/@simoneldevig_80359/building-chrome-extensions-with-vue-js-cafaefb82bd4

[61] MSK Vue.js Meetup #2: https://www.youtube.com/playlist?list=PLOviqqLrTTvMZdj8bM9wUeLLO2naYdKm_

[62] «WARNING: sanitizing HTML stripped some content» и как с ним правильно бороться: https://habr.com/ru/company/tinkoff/blog/459396/

[63] Как использовать компоненты рекурсивно в Angular : https://medium.com/better-programming/how-to-use-components-recursively-in-angular-6569459f6318

[64] Angular и доступность: проблемы и стратегии: https://www.deque.com/blog/angular-and-accessibility-issues-and-strategies/

[65] Как работать с асинхронными провайдерами в Angular: https://medium.com/better-programming/how-to-handle-async-providers-in-angular-51884647366

[66] Релиз Ember 3.13 (Octane превью): https://blog.emberjs.com/2019/09/25/ember-3-13-released.html

[67] Промисы и пользовательские состояния в Ember.js: https://embersteps.com/promises-and-ui-states-in-ember-js/

[68] Подкаст JSJ 395: Новый New Ember с Mike North: https://devchat.tv/js-jabber/jsj-395-the-new-ember-with-mike-north/

[69] Анимация роутов с Ember Animated: https://www.youtube.com/watch?v=O4Mt-dDqkk0

[70] Как рисует браузер. Доклад Яндекса: https://habr.com/ru/company/yandex/blog/468165/

[71] Microsoft портирует браузер Edge на Linux: https://www.opennet.ru/opennews/art.shtml?num=51577

[72] Google, Mozilla и Cloudflare начали поддерживать протокол HTTP/3: https://tproger.ru/news/chrome-firefox-cloudflare-http3/

[73] Mac перестали загружаться из-за обновления Google Chrome: https://xakep.ru/2019/09/27/chrome-var-bug/

[74] Как сделать скриншот сайта с высоким DPI в Firefox: https://www.reddit.com/r/firefox/comments/d7zelb/til_how_to_take_a_high_dpi_website_screenshot_in/

[75] CloudFlare запустил бесплатный VPN — без регистрации (и SMS): https://habr.com/ru/news/t/468895/

[76] GitHub открыл наработки по применению машинного обучения для поиска и анализа кода: https://www.opennet.ru/opennews/art.shtml?num=51570

[77] Продали технологии в Snap и набрали популярность на функции «какая ты знаменитость»: кто разработал приложение Gradient Материал редакции: https://vc.ru/services/84845-prodali-tehnologii-v-snap-i-nabrali-populyarnost-na-funkcii-kakaya-ty-znamenitost-kto-razrabotal-prilozhenie-gradient

[78] Yahoo сменила логотип и провела ребрендинг: https://vc.ru/design/85162-yahoo-smenila-logotip-i-provela-rebrending

[79] GitHub запускает свои щупальца в CI/CD и менеджмент артефактов: https://habr.com/ru/post/468345/

[80] Почему разработчики так любят тёмную тему: https://habr.com/ru/company/dodopizzaio/blog/467925/

[81] Дайджест за прошлую неделю: https://habr.com/ru/post/468431/

[82] dersmoll: http://habrahabr.ru/users/dersmoll/

[83] alekskorovin: http://habrahabr.ru/users/alekskorovin/

[84] Источник: https://habr.com/ru/post/469413/?utm_source=habrahabr&utm_medium=rss&utm_campaign=469413