Дайджест свежих материалов из мира фронтенда за последнюю неделю №404 (24 февраля — 1 марта 2020)

---

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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] JavaScript: #js

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

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

[7] Подкаст «Веб-стандарты» №218: Опять гриды, градиенты всё лучше, блокирующий CSS, веб-компоненты, всё про кнопки и disabled: https://medium.com/web-standards/episode-218-4e8cd079eeac

[8] Подкаст «Фронтенд Юность (18+)» #127: Мало половин. Часть первая: https://soundcloud.com/frontend_u/e127_1

[9] Подкаст «Сделайте мне красиво», Выпуск №35 — Зарплаты, деплои по пятницам и гордыня функциональщиков: https://soundcloud.com/begebot/ep35

[10] Я <3 Фронтенд 2020 — Запись трансляции: https://www.youtube.com/watch?v=eLlULhNNthI&amp;feature=youtu.be

[11] Интернационализация: как сделать веб доступным для всех: https://habr.com/ru/company/jugru/blog/489858/

[12] Влияют ли теги H1 на ранжирование в Google– эксперимент Moz: https://www.searchengines.ru/h1-google.html

[13] Rome, новый JavaScript инструментарий от создателя Yarn и Babel из Facebook: https://jasonformat.com/rome-javascript-toolchain/

[14] Один день из жизни: как фронтенд-разработчик исправляет «простой» баг : https://dev.to/codedivoire/a-day-in-the-life-how-a-frontend-developer-solves-a-simple-bug-3e98

[15] Хватит использовать слово ‘Drop-down’: https://adrianroselli.com/2020/03/stop-using-drop-down.html

[16] «Render-Blocking JavaScript and CSS on WordPress». Как это исправить?: https://habr.com/ru/post/490274/

[17] Ускоряем фронтенд. Когда много запросов к серверу — это хорошо: https://habr.com/ru/company/itsumma/blog/490210/

[18] Стоит ли хранить Google Fonts на своём сервере?: https://habr.com/ru/company/vdsina/blog/490366/

[19] Улучшение воспринимаемой производительности с помощью свойства CSS `font-display` : https://nooshu.github.io/blog/2020/02/23/improving-perceived-performance-with-the-css-font-display-property/

[20] Браузерная производительность, ограниченная разными Feature Policy : https://timkadlec.com/remembers/2020-02-20-in-browser-performance-linting-with-feature-policies/

[21] Почему 543 KB не дают мне спать по ночам : https://www.matuzo.at/blog/why-543kb-keep-me-up-at-night/

[22] CSS против коронавируса: доступное представление иерархических табличных данных: https://css-live.ru/tricks/css-protiv-koronavirusa-dostupnoe-predstavlenie-ierarxicheskix-tablichnyx-dannyx.html

[23] 5 распространенных проблем с доступностью веб-приложений и способы их устранения : https://keepinguptodate.com/pages/2020/02/common-web-accessibility-issues/

[24] HTML: недоступные части : https://daverupert.com/2020/02/html-the-inaccessible-parts/

[25] Создание карандашного эффекта в SVG: https://habr.com/ru/post/489756/

[26] Анимация SVG-текста в Path : https://tympanus.net/codrops/2020/02/26/animating-svg-text-on-a-path/

[27] Аудио эффекты искажения изображения с WebGL : https://tympanus.net/codrops/2020/02/24/audio-based-image-distortion-effects-with-webgl/

[28] Стилизация старого доброго элемента button: https://habr.com/ru/company/ruvds/blog/489820/

[29] Старый и новый CSS. История веб-дизайна: https://habr.com/ru/post/489778/

[30] В W3C появилась общественная группа по CSS4: https://css-live.ru/vecssti-s-polej/v-w3c-poyavilas-obshhestvennaya-gruppa-po-css4.html

[31] Адаптивный макет сетки журнала всего в 20 строках CSS : https://css-tricks.com/responsive-grid-magazine-layout-in-just-20-lines-of-css/

[32] Эффект линии, переплетенной между букв на CSS: https://css-tricks.com/weaving-a-line-through-text-in-css/

[33] Умная анимация с пользовательскими свойствами : https://equinusocio.dev/blog/smart-animations-with-custom-properties/

[34] Негативные margin в CSS: https://www.quirksmode.org/blog/archives/2020/02/negative_margin.html

[35] Buttono — Гибкий Sass-миксин для создания кнопок в стиле БЭМ : https://hsnaydd.github.io/buttono/

[36] Почему CSS расстраивает?: https://css-tricks.com/why-is-css-frustrating/

[37] CSS Motion Path: Конец GSAP?: https://blog.logrocket.com/css-motion-path-the-end-of-gsap/

[38] JavaScript и кое-что ещё: 4 креативных подхода к измерению времени в браузерах: https://habr.com/ru/company/ruvds/blog/489818/

[39] Может, нам слегка успокоиться с JavaScript?: https://habr.com/ru/post/490412/

[40] JavaScript tree shaking, like a pro: https://habr.com/ru/company/funcorp/blog/490014/

[41] Интернационализация JavaScript в 2020 году : https://diary.braniecki.net/2020/02/14/js-intl-in-2020/

[42] 4 рекомендации по написанию качественных модулей в JavaScript : https://dmitripavlutin.com/javascript-modules-best-practices/

[43] Как использовать JavaScript Internationalization API: https://medium.com/javascript-in-plain-english/how-to-use-the-javascript-internalization-intl-object-with-their-last-features-148c6acdeb67

[44] Динамическая и асинхронная функциональность в JAMstack : https://blog.logrocket.com/dynamic-and-async-functionality-in-jamstack/

[45] 5 лучших JavaScript-фреймворков: визуализация многолетних опросов разработчиков : https://dev.to/jscharting/5-best-front-end-javascript-frameworks-multi-year-developer-surveys-visualized-11p

[46] Работа с GeoJSON в среде Node.js: практическое знакомство: https://habr.com/ru/company/ruvds/blog/489828/

[47] Пишем babel плагин, пошаговое руководство: https://habr.com/ru/post/490456/

[48] Задачи по JavaScript от Microsoft: https://habr.com/ru/post/489452/

[49] Создание аркадной игры на ванильном JavaScript : https://medium.com/better-programming/build-an-arcade-game-with-vanilla-javascript-d318fc94832b

[50] Кэширование ответов GraphQL : https://logaretm.com/blog/2020-02-24-caching-graphql-requests/

[51] Создание PWA на Vanilla JavaScript. Часть 2. Push API : https://alligator.io/js/push-api/

[52] Понимание спецификации ECMAScript, часть 1: https://habr.com/ru/post/490084/

[53] Об изменчивых методах объекта Math в JavaScript: https://habr.com/ru/company/ruvds/blog/489826/

[54] 2 способа преобразования значений в Boolean в JavaScript : https://medium.com/dailyjs/2-ways-to-convert-values-to-boolean-in-javascript-2abee60af76d

[55] Как начать думать функционально в JavaScript : https://itnext.io/how-to-start-thinking-functionally-in-javascript-b7805e3b48e

[56] Все, что вы хотите знать о Service Worker : https://dev.to/niscontractor/everything-you-want-to-know-about-service-worker-4c91

[57] Используем Axios в React: https://medium.com/@stasonmars/%D0%B8%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D1%83%D0%B5%D0%BC-axios-%D0%B2-react-453c04ed0654

[58] 10 фишек из JavaScript, которые помогут писать более качественный код на React: https://tproger.ru/articles/10-js-conception-for-react/

[59] React + Canvas = Love: https://thibaut.io/react-canvas-components

[60] React Query — Хуки для выборки, кэширования и обновления асинхронных данных в React: https://github.com/tannerlinsley/react-query

[61] Почему вы должны с умом использовать refs на продакшене : https://blog.logrocket.com/why-you-should-use-refs-sparingly-in-production/

[62] React.useRef и React.createRef: разница : https://blog.bitsrc.io/react-useref-and-react-createref-the-difference-afedb9877d0f

[63] Вам нравится Redux? Тогда вам понравятся react-connect-context-hooks! : https://medium.com/dailyjs/do-you-like-redux-then-youll-love-react-connect-context-hooks-44d6cc421fc3

[64] Ошибки, которые допускают джуниор разработчики на React : https://medium.com/frontend-digest/mistakes-junior-react-developers-make-c546b1af187d

[65] Настройка Tailwind CSS в проекте на React : https://www.smashingmagazine.com/2020/02/tailwindcss-react-project/

[66] Создаем прогрессивный PWA интернет-магазин на Nuxt.js 2 пошаговое руководство Часть 1: https://habr.com/ru/post/490496/

[67] Vue.js: The Documentary: https://www.youtube.com/watch?v=OrxmtDw4pVI

[68] Создание приложения с помощью Vue и TypeScript. Лучшие практики, мысли и рекомендации. : https://stefan-bauer.online/building-an-application-with-vue-and-type-script-best-practices-thoughts-and-recommendations/

[69] Как создать музыкальный менеджер с Nuxt.js и Express.js : https://www.smashingmagazine.com/2020/02/music-manager-nuxtjs-expressjs/

[70] Начало работы с тестированием Vue.js: ваше руководство по ресурсам : https://madewithvuejs.com/blog/how-to-learn-vue-js-testing-the-ultimate-guide

[71] (Примерное) Воссоздание Vue 3 Reactivity API : https://dev.to/ycmjason/recreating-vue-3-reactivity-api-roughly-1o6a

[72] Использование конечных автоматов в Vue.js с XState : https://frontstuff.io/using-state-machines-in-vuejs-with-xstate

[73] Как создать эпическое приложение на Angular менее чем за 10 минут! ️ : https://medium.com/@tomastrajan/how-to-build-epic-angular-app-with-clean-architecture-91640ed1656

[74] Вот почему вы должны использовать Angular 9 сегодня : https://labs.thisdot.co/blog/this-is-why-you-should-go-angular-9-today

[75] Everything GitHub: Continuous Integration, Deployment и хостинг для вашего Angular приложения : https://dev.to/angular/everything-github-continuous-integration-deployment-and-hosting-for-your-angular-app-25j3

[76] Дорожная карта для Angular-разработчиков на 2020 : https://dev.to/monicafidalgo/angular-developer-roadmap-for-2020-3eb4

[77] Реактивные приключения в Angular: знакомство с Angular Effects : https://dev.to/stupidawesome/reactive-adventures-in-angular-introducing-angular-effects-1epf

[78] Создание приложения TODO в Svelte : https://dev.to/areknawo/making-a-todo-app-in-svelte-57l3

[79] Тестирование асинхронных изменений состояния в Svelte : https://dev.to/d_ir/testing-svelte-async-state-changes-3mip

[80] Управление государством в Svelte : https://dev.to/joshnuss/managing-state-in-svelte-29o7

[81] The Ember Times — Выпуск 136: https://habr.com/ru/post/489776/

[82] Как работает Autotracking: https://www.pzuraq.com/how-autotracking-works/

[83] Разделение и миграция вашего Ember проекта в монорепозиторий : https://www.mylittletechlife.com/ember-monorepo

[84] serialize-javascript — Сериализация JavaScript для расширенного набора JSON, который включает в себя регулярные выражения и функции.: https://github.com/yahoo/serialize-javascript

[85] DarkModeJS — помогает вам автоматически определять время пользователя и переключать тему на темную сторону: https://github.com/nickdeny/darkmode-js

[86] В Firefox 75 будут убраны https:// и www из выпадающего блока адресной строки: https://www.opennet.ru/opennews/art.shtml?num=52435

[87] 0-day уязвимость в Chrome, выявленная через анализ изменений в движке V8: https://www.opennet.ru/opennews/art.shtml?num=52442

[88] Mozilla начинает внедрение технологии изоляции библиотек RLBox: https://www.opennet.ru/opennews/art.shtml?num=52440

[89] Google выпустил для Firefox систему аудита web-страниц Lighthouse: https://www.opennet.ru/opennews/art.shtml?num=52421

[90] В браузер Brave интегрировано обращение к archive.org для просмотра удалённых страниц: https://www.opennet.ru/opennews/art.shtml?num=52453

[91] У Chrome есть динозаврик, а у Microsoft Edge будет сёрфинг: https://www.computerra.ru/254745/u-chrome-est-dinozavrik-a-u-microsoft-edge-budet-syorfing/

[92] Защита Firefox с помощью WebAssembly : https://hacks.mozilla.org/2020/02/securing-firefox-with-webassembly/

[93] «Могу ли я… в новом Edge?» : https://textslashplain.com/2020/02/26/can-i-in-the-new-edge/

[94] Как цифровая реклама будет жить без cookie-файлов : https://ain.ua/2020/02/29/adtech-bez-cookies/

[95] Поисковый сервис Google Images будет выводить больше сведений об изображениях — маркировать товары, рецепты и видео: https://itc.ua/news/poiskovyj-servis-google-images-budet-vyvodit-bolshe-svedenij-ob-izobrazheniyah-markirovat-tovary-reczepty-i-video/

[96] Патентные войны и спорщик на миллион: история изобретения колючей проволоки и её самого успешного продавца в 19 веке Материал редакции: https://vc.ru/story/108030-patentnye-voyny-i-sporshchik-na-million-istoriya-izobreteniya-kolyuchey-provoloki-i-ee-samogo-uspeshnogo-prodavca-v-19-veke

[97] Горе обновленным. Почему апдейты могут лишить вас не только смартфона, но и автомобиля: https://nplus1.ru/material/2020/02/25/no-updates-please

[98] Google переведет все сайты на mobile-first индексацию в течение 6-12 месяцев: https://www.seonews.ru/events/google-perevedet-vse-sayty-na-mobile-first-indeksatsiyu-v-techenie-6-12-mesyatsev/

[99] Google о предстоящих изменениях в обработке nofollow: https://www.searchengines.ru/nofollow-crawling.html

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

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

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

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

Нажмите здесь для печати.