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

---

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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] JavaScript: #js

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

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

[7] Подкаст «Веб-стандарты» №226: Браузеры, Chakra Core, Shower 3.0, jQuery, Гитхаб, ES-импорты, TC39, Телеграм против веба: https://medium.com/web-standards/episode-226-4630c139dd46

[8] Pro Conf #59: Virtual EmberConf 2020 — Фронтенд Балерина | Ember Octane | Спасибо что живой: https://www.youtube.com/watch?v=sdzC2hHtC64

[9] Подкаст «Фронтенд Юность (18+)» #134: Всё выглядит сложно, если ты тупой: https://soundcloud.com/frontend_u/e134

[10] Repozitorro #40 — Никогда такого не было, и вот опять!: https://www.youtube.com/watch?v=6CAp-j6Zn0M

[11] Веб-компоненты в реальном проекте: https://habr.com/ru/company/exness/blog/498560/

[12] В ночные сборки Firefox добавлена поддержка WebGPU: https://www.opennet.ru/opennews/art.shtml?num=52800

[13] Ограничение input type=”color” определенной палитрой (из изображения) : https://christianheilmann.com/2020/04/22/limiting-input-type-color-to-a-certain-palette-from-an-image/

[14] Разработка отзывчивых сайтов и веб-приложений с помощью Flutter : https://www.smashingmagazine.com/2020/04/responsive-web-desktop-development-flutter/

[15] Вы уже используете SVG для фавиконок? Руководство для современных браузеров.: https://medium.com/@antoineboulanger/are-you-using-svg-favicons-yet-a-guide-for-modern-browsers-836a6aace3df

[16] SVG, Favicons и все самое интересное, что мы можем с ними сделать : https://css-tricks.com/svg-favicons-and-all-the-fun-things-we-can-do-with-them/

[17] Мониторинг всей памяти, используемой веб-страницей: performance.measureMemory(): https://habr.com/ru/company/ruvds/blog/497986/

[18] 4 самых распространенных ошибок тестирования скорости страниц : https://www.machmetrics.com/speed-blog/4-most-common-page-speed-testing-mistakes/

[19] Лучшая оптимизация изображения за счет ограничения Color Index : https://meyerweb.com/eric/thoughts/2020/04/22/better-image-optimization-by-restricting-the-color-index/

[20] Эффективность Brotli в реальном мире : https://csswizardry.com/2020/04/real-world-effectiveness-of-brotli/

[21] CSS: использование внутренних и внешних отступов: https://habr.com/ru/company/ruvds/blog/499120/

[22] Практика CSS Scroll Snapping: https://habr.com/ru/post/498456/

[23] 98.css — набор стилей для воссоздания старых интерфейсов. : https://jdan.github.io/98.css/

[24] Создание масштабируемой архитектуры CSS с помощью BEM и служебных классов : https://css-tricks.com/building-a-scalable-css-architecture-with-bem-and-utility-classes/?ref=heydesigner

[25] Интервалы в CSS : https://ishadeed.com/article/spacing-in-css/

[26] Интересная новая техника CSS-in-JS, с которой я не спускаю глаз : https://medium.com/frontend-digest/a-really-cool-new-exploration-in-css-in-js-land-that-im-keeping-my-eyes-on-76d4b0c479d4

[27] CSS для интернационализации : https://www.chenhuijing.com/blog/css-for-i18n/#%F0%9F%91%9F

[28] Темный режим и вариативные шрифты : https://css-tricks.com/dark-mode-and-variable-fonts/

[29] Онлайн-генератор нестандартных разделителей секций в CSS : https://wweb.dev/resources/css-separator-generator

[30] Как сделать карусель на CSS : https://css-tricks.com/how-to-make-a-css-only-carousel/

[31] Руководство по созданию CSS-существ, вдохновленных коронавирусом : https://medium.com/cssclass-com/learning-how-to-create-css-creatures-8318d85d8924

[32] Создание забавных эффектов с помощью CSS Text Shadow: https://css-tricks.com/creating-playful-effects-with-css-text-shadows/

[33] Объяснение доступности размеров шрифтов: https://css-tricks.com/accessible-font-sizing-explained/

[34] 23 непростых вопроса для JavaScript-собеседования: https://habr.com/ru/company/ruvds/blog/499014/

[35] Доступна 14 версия Node.js: https://devkucher.com/posts/dostupna-14-versiya-node-js

[36] Isomorphic Layout Composer — комплексное решение для микро-фронтендов в SPA с поддержкой SSR: https://github.com/namecheap/ilc

[37] Цена Javascript фреймворков : https://timkadlec.com/remembers/2020-04-21-the-cost-of-javascript-frameworks/

[38] JavaScript Style Guide: основные выводы из стайлгайда Google: https://blog.w3radar.com/key-takeaways-google-javascript-style-guide/

[39] The Clear Architecture на примере TypeScript и React: https://habr.com/ru/post/499078/

[40] [теория] Разница между веб-сокетами (WebSockets) и Socket.IO: https://habr.com/ru/post/498996/

[41] Как работает TypeScript? Взгляд с высоты птичьего полета : https://2ality.com/2020/04/typescript-workflows.html

[42] 3D-аркада в браузере: как мы сделали игру на React + Redux: https://habr.com/ru/company/2gis/blog/498638/

[43] Реализация скелетон-сетки в React: https://www.smashingmagazine.com/2020/04/skeleton-screens-react/?ref=heydesigner

[44] Компилятор, который конвертирует React-совместимый код в VanillaJS без Virtual DOM : https://mohebifar.github.io/vidact/

[45] Начало работы с react-redux-firebase: https://blog.logrocket.com/getting-started-react-redux-firebase/

[46] Пишем (более) чистые компоненты и JSX : https://itnext.io/write-clean-er-components-jsx-1e70491baded

[47] React Hook Form — Элегантное решение для форм в React: https://blog.bitsrc.io/react-hook-form-an-elegant-solution-to-forms-in-react-4db64505b0cd

[48] React Podcast 91: Dominic Nguyen on Chromatic and Visual Regression Testing: https://reactpodcast.com/91

[49] VueJS 3.0.0 Beta: функции, которыми я восхищаюсь: https://blog.bitsrc.io/vuejs-3-0-0-beta-features-im-excited-about-c70b82fac163

[50] Превращение компонентов Vue в переиспользуемые npm пакеты : https://www.voorhoede.nl/en/blog/turning-vue-components-into-reusable-npm-packages/

[51] Vue.js: роуты с ленивой загрузкой и динамические комментарии в Webpack : https://dev.to/baumannzone/vue-js-lazy-load-routes-webpack-dynamic-comments-51nf

[52] Angular: правильные вызовы API : https://blog.w3radar.com/angular-making-api-calls-the-right-way/

[53] 10 менее известных функций Angular, которые вы, вероятно, никогда не использовали : https://blog.w3radar.com/less-known-angular-features-probably-never-used/

[54] Как реализовать drag and drop в Angular 9 : https://www.thirdrocktechkno.com/blog/building-interactive-lists-with-the-new-angular-7-drag-and-drop-tool

[55] The Ember Times — Issue No. 145: https://dev.to/embertimes/the-ember-times-issue-no-145-59i7

[56] Autotracking Case Study — TrackedMap: https://www.pzuraq.com/autotracking-case-study-trackedmap/

[57] Ember-Glue: Как может выглядеть UI-библиотека нового поколения для компонентов в Ember Octane?: https://www.linkedin.com/pulse/ember-glue-what-could-next-generation-ui-component-library-munjal

[58] Svelte, исчезающий фреймворк, что всё никак не исчезал: https://habr.com/ru/post/498650/

[59] Svelte, исчезающий фреймворк, который уже не исчезнет: https://habr.com/ru/post/498702/

[60] Обработчики событий и Svelte : https://dev.to/umanghome/event-handlers-and-svelte-4f5k

[61] Расширенный HTML: https://habr.com/ru/post/499106/

[62] markmap-lib — Визуализация Markdown в качестве диаграммы связей с Markmap.: https://markmap.js.org/

[63] Как делать потрясающие визуализации данных с D3.js : https://medium.com/javascript-in-plain-english/how-to-make-stunning-data-visualizations-with-d3-js-93a588600b45

[64] Crank.js — пишите JSX-driven компоненты с помощью функций, промисов и генераторов. : https://crank.js.org/

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

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

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

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

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