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

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

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

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

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №409 (30 марта — 5 апреля 2020) - 2 Веб-разработка

habr Концепции, лежащие в основе Web Audio API [6]
habr Intersection Observer API: примеры использования [7]
Туториал. Интерактивная SVG-диаграмма [8]
en Простой способ имплементации адаптивных изображений [9]
en BEM Cheat Sheet [10]
en Почему некоторые элементы HTML становятся устаревшими? [11]
en 30 чеклистов для веб-разработчиков, которые должны быть под рукой у каждой команды [12]
en Стратегии тестирования для фронтенд разработчиков [13]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №409 (30 марта — 5 апреля 2020) - 19 CSS

habr Всё о ключевом слове auto в CSS [24]
habr CSS Houdini: практическое руководство [25]
Комбинации в CSS: filter и clip-path [26]
Плавность анимации CSS: миф или реальность [27]
en Overflow в CSS [28]
en Заставляем JavaScript общаться с CSS и Sass [29]
en 4 свойства CSS Grid (и одно значение) для большинства потребностей вашего макета [30]
en Цвета LCH в CSS: что, почему и как? [31]
en CSS-Only Marquee Effect [32]
en Добытая информация о CSS из нового дизайна Facebook [33]
en Обратный инжиниринг CSS в WhatsApp [34]

JavaScript

habr Почему пора перестать использовать JavaScript IIFE [35]
habr Введение в 3D: основы Three.js [36]
en 10 новых функций JavaScript в ES2020, которые вы должны знать [37]
en Как работает анти-блокировщик рекламы: обратный инжиниринг BlockAdBlock [38]
en То, что держит меня по ночам, как JS разработчика. Обсуждение некоторых из самый сложных аспектов Javascript и их возможное решение [39]
en Layout-isolated components [40]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №409 (30 марта — 5 апреля 2020) - 63 Браузеры

Mozilla запустила процесс замены браузера Firefox Beta на Fenix [70]
Google отменяет предложенное в Chrome 80 ужесточение обработки сторонних Cookie [71]
en Популярность Firefox падает, Microsoft Edge становится вторым по популярности веб-браузером после Chrome [72]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №409 (30 марта — 5 апреля 2020) - 65 Занимательное

Подборка первоапрельских шуток 2020 года [73]
Fedora и CentOS запускают Git Forge. GitLab открывает 18 проприетарных возможностей [74]
Google предстaвил систему поиска и навигации по коду своих открытых проектов [75]
Крутое пике: как пандемия коронавируса изменила IT-отрасль [76]
Вышел WordPress 5.4 «Adderley» с улучшенным редактором, новыми блоками и API для разработчиков [77]
В Font Awesome появились новые иконки, связанные с COVID-19 [78]

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

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

Автор: alexzfort

Источник [82]


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

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

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

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

[2] CSS: #css

[3] JavaScript: #js

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

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

[6] Концепции, лежащие в основе Web Audio API: https://habr.com/ru/post/495690/

[7] Intersection Observer API: примеры использования: https://habr.com/ru/post/494670/

[8] Туториал. Интерактивная SVG-диаграмма: https://htmlacademy.ru/blog/boost/frontend/svg-chart

[9] Простой способ имплементации адаптивных изображений : https://cloudfour.com/thinks/responsive-images-the-simple-way/?ref=heydesigner

[10] BEM Cheat Sheet: https://9elements.com/bem-cheat-sheet/

[11] Почему некоторые элементы HTML становятся устаревшими? : https://css-tricks.com/why-do-some-html-elements-become-deprecated/

[12] 30 чеклистов для веб-разработчиков, которые должны быть под рукой у каждой команды : https://www.sitepoint.com/web-development-checklists/

[13] Стратегии тестирования для фронтенд разработчиков : https://medium.com/better-programming/testing-strategies-for-front-end-developers-a2ebbc5191a2

[14] Введение в Chrome DevTools. Панель Elements: https://htmlacademy.ru/blog/boost/tools/chrome-devtools-1

[15] Как настроить MacBook для веб-разработки в 2020 году: https://medium.com/better-programming/setting-up-your-mac-for-web-development-in-2020-659f5588b883

[16] Инструменты для работы — Как я пишу веб-приложения в 2020 году : https://medium.com/@loup.topalian/the-tools-for-the-job-how-i-code-frontend-apps-in-2020-94e899213f03

[17] Аннотированный Docker конфиг для разработки фронтенда : https://nystudio107.com/blog/an-annotated-docker-config-for-frontend-web-development

[18] Использование современных графических форматов в веб-проектах: https://habr.com/ru/company/ruvds/blog/494710/

[19] О позитивном влиянии вариативных шрифтов на производительность веб-проектов: https://habr.com/ru/company/ruvds/blog/494714/

[20] Производительность во время пандемии : https://calibreapp.com/blog/performance-during-pandemic

[21] Как улучшить скорость страницы от начала до конца (Продвинутое руководство) : https://ahrefs.com/blog/advanced-pagespeed-guide/

[22] Расширяемая производительная анимация: создание кадров на лету : https://css-tricks.com/performant-expandable-animations-building-keyframes-on-the-fly/

[23] Подборка вдохновляющих сайтов «Inspirational Websites Roundup #14»: https://tympanus.net/codrops/2020/03/30/inspirational-websites-roundup-14/

[24] Всё о ключевом слове auto в CSS: https://habr.com/ru/company/ruvds/blog/494716/

[25] CSS Houdini: практическое руководство: https://habr.com/ru/post/494660/

[26] Комбинации в CSS: filter и clip-path: https://medium.com/front-end-in-regions-grodno/%D0%BA%D0%BE%D0%BC%D0%B1%D0%B8%D0%BD%D0%B0%D1%86%D0%B8%D0%B8-%D0%B2-css-filter-%D0%B8-clip-path-ed6849fa1005

[27] Плавность анимации CSS: миф или реальность: https://dou.ua/lenta/articles/css-animation/

[28] Overflow в CSS: https://ishadeed.com/article/overflow-css/

[29] Заставляем JavaScript общаться с CSS и Sass: https://css-tricks.com/getting-javascript-to-talk-to-css-and-sass/

[30] 4 свойства CSS Grid (и одно значение) для большинства потребностей вашего макета : https://css-tricks.com/4-css-grid-properties-and-one-value-for-most-of-your-layout-needs/

[31] Цвета LCH в CSS: что, почему и как? : http://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/

[32] CSS-Only Marquee Effect: https://tympanus.net/codrops/2020/03/31/css-only-marquee-effect/

[33] Добытая информация о CSS из нового дизайна Facebook : https://ishadeed.com/article/new-facebook-css/

[34] Обратный инжиниринг CSS в WhatsApp : https://blog.animaapp.com/reverse-engineering-whatsapp-webs-css-9239293009f4

[35] Почему пора перестать использовать JavaScript IIFE: https://habr.com/ru/company/ruvds/blog/494868/

[36] Введение в 3D: основы Three.js: https://habr.com/ru/post/494810/

[37] 10 новых функций JavaScript в ES2020, которые вы должны знать : https://www.freecodecamp.org/news/javascript-new-features-es2020/

[38] Как работает анти-блокировщик рекламы: обратный инжиниринг BlockAdBlock : https://xy2.dev/article/re-bab/

[39] То, что держит меня по ночам, как JS разработчика. Обсуждение некоторых из самый сложных аспектов Javascript и их возможное решение: https://blog.bitsrc.io/being-a-js-developer-this-is-what-keeps-me-up-at-night-36548f044b2e

[40] Layout-isolated components : https://visly.app/blog/layout-isolated-components?ref=heydesigner

[41] Понимание параметров по умолчанию в JavaScript : https://www.taniarascia.com/default-parameters-javascript/

[42] Введение в лямбда-исчисление, объясненное через JavaScript : http://willtaylor.blog/an-introduction-to-lambda-calculus-explained-through-javascript/

[43] Основные ошибки JavaScript разработчиков : https://medium.com/flatlogic/top-mistakes-javascript-developers-make-7df61b6cb351

[44] Разработка формы на React. Принципы KISS, YAGNI, DRY на практике: https://habr.com/ru/post/495518/

[45] 5 практических рекомендаций по использованию React-хуков в продакшне: https://habr.com/ru/company/ruvds/blog/494712/

[46] 9 способов манипуляции и работы с компонентами в React: https://medium.com/better-programming/9-ways-to-manipulate-and-work-with-components-in-react-cf0a7a2b194f

[47] Преобразование CSS в React в Styled Components : https://scotch.io/tutorials/converting-css-in-react-to-styled-component

[48] Как перейти от использования компонентов высшего порядка к React Hooks: https://scotch.io/tutorials/how-to-move-from-consuming-higher-order-components-to-react-hooks

[49] Сессия отладки в React — Почему эта функция вызывается сотни раз?: https://jkettmann.com/react-debugging-session-hundreds-of-function-calls/

[50] Создание веб-приложения с Headless CMS и React : https://www.smashingmagazine.com/2020/04/web-app-headless-cms-react/

[51] Как создать приложение Dashboard & Map для Coronavirus (COVID-19) с помощью Gatsby и Leaflet : https://www.freecodecamp.org/news/how-to-create-a-coronavirus-covid-19-dashboard-map-app-in-react-with-gatsby-and-leaflet/

[52] Темизация React компонентов с помощью CSS переменных: https://blog.bitsrc.io/theming-react-components-with-css-variables-ee52d1bb3d90

[53] Чистые, масштабируемые формы с Vue Composition API: https://vuejsdevelopers.com/2020/03/31/vue-js-form-composition-api/

[54] Обзор того, что будет в Vue 3 : https://alligator.io/vuejs/whats-coming-in-vue-3/

[55] Пробуем Test-Driven разработку с помощью Jest и Angular: https://medium.com/better-programming/test-driven-development-attempt-with-jest-and-angular-7e064b76ca2d

[56] Ускорьте ваше Angular приложение — 14 советов по оптимизации Angular : https://medium.com/grapecity/how-to-speed-up-your-angular-app-in-14-ways-802d85b711f9

[57] Контейнеризяция Angular приложений для продакшена с использованием Docker : https://dev.to/usmslm102/containerizing-angular-application-for-production-using-docker-3mhi

[58] JSX для Angular разработчиков: https://dev.to/daviddalbusco/jsx-for-angular-developers-44c7

[59] The Ember Times — Issue No. 142: https://dev.to/embertimes/the-ember-times-issue-no-142-386f

[60] Ember Octane: извлечение данных : https://yehudakatz.com/2020/03/30/ember-octane-a-data-file/

[61] Портирование сайта на Ember с помощью Percy : https://simplabs.com/blog/2020/03/27/porting-a-site-to-ember-with-percy/

[62] Скажи привет Theemo — Yordle Powered Theme Automator : https://gos.si/blog/say-hello-to-theemo-the-yordle-powered-theme-automator/

[63] Справочник по компилятору Svelte : https://lihautan.com/the-svelte-compiler-handbook/

[64] часть 1: https://dev.to/ism/svelte-routing-with-page-js-part-1-2h9h

[65] часть 2: https://dev.to/ism/svelte-routing-with-page-js-part-2-4l76

[66] JavaScript фреймворк, который посадил веб-страницы на диету: https://www.wired.com/story/javascript-framework-puts-web-pages-diet/

[67] Выпущен simdjson 0.3: самый быстрый JSON-анализатор в мире стал еще лучше! : https://lemire.me/blog/2020/03/31/we-released-simdjson-0-3-the-fastest-json-parser-in-the-world-is-even-better/

[68] Notyf — Минималистичная JS библиотека для toast-уведомлений. Отзывчивость, A11Y, без зависимостей.: https://carlosroso.com/notyf/

[69] Aeon — инструмент выбора даты и времени, созданный с помощью веб-компонентов, которые можно использовать где угодно: https://github.com/lamplightdev/aeon

[70] Mozilla запустила процесс замены браузера Firefox Beta на Fenix: https://itc.ua/news/mozilla-zapustila-proczess-zameny-brauzera-firefox-beta-na-fenix/

[71] Google отменяет предложенное в Chrome 80 ужесточение обработки сторонних Cookie: https://www.opennet.ru/opennews/art.shtml?num=52673

[72] Популярность Firefox падает, Microsoft Edge становится вторым по популярности веб-браузером после Chrome : https://www.techradar.com/uk/news/firefoxs-popularity-falls-further-as-microsoft-edge-becomes-second-most-popular-web-browser-after-chrome

[73] Подборка первоапрельских шуток 2020 года: https://www.opennet.ru/opennews/art.shtml?num=52659

[74] Fedora и CentOS запускают Git Forge. GitLab открывает 18 проприетарных возможностей: https://www.opennet.ru/opennews/art.shtml?num=52642

[75] Google предстaвил систему поиска и навигации по коду своих открытых проектов: https://www.opennet.ru/opennews/art.shtml?num=52668

[76] Крутое пике: как пандемия коронавируса изменила IT-отрасль: https://3dnews.ru/1007282/#5e8462f4b4182e5f56af0ebf

[77] Вышел WordPress 5.4 «Adderley» с улучшенным редактором, новыми блоками и API для разработчиков: https://oddstyle.ru/wordpress-2/novosti-wordpress/vyshel-wordpress-5-4-adderley-s-uluchshennym-redaktorom-novymi-blokami-i-api-dlya-razrabotchikov.html

[78] В Font Awesome появились новые иконки, связанные с COVID-19: https://oddstyle.ru/wordpress-2/wordpress-plaginy/v-font-awesome-poyavilis-novye-ikonki-svyazannye-s-covid-19.html

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

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

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

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