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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №454 (8 — 14 февраля 2021)

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №454 (8 — 14 февраля 2021) - 1

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

Медиа

podcast Подкаст «Веб-стандарты» 268. Npm 7, PCM, V8 v8.9, App History API, прагматичные книги, Docker: зачем, как и чьё это дело [7]
podcast «Новости 512» от CSSSR: Эра ES-модулей, релизы Node.js LTS, CSS transition, width & height, WebdriverIO 7, Rust Foundation [8]
video HolyJS 2020 Moscow [9]
video Отсобеседование #1: Открытое собеседование frontend разработчика (Middle) [10]

Веб-разработка

habr Боль фронтов, или что нам нужно от дизайнеров [11]
en Weekly Platform News: WebKit autofill, использование Cursor Pointer, задержка автоматического проигрывания видео [12]
en 21 плохая фронтенд-привычка, от которых стоит отказаться в 2021 году [13]
en Доступ к аппаратному обеспечению в вебе [14]
en Разработка производительного пользовательского курсора [15]
en Управление фокусом в shadow DOM [16]
en Почему вы должны превратить свое приложение в PWA [17]
en Отладка WebAssembly с помощью Chrome DevTools [18]
en Простая анимация линий при наведения курсора для ссылок [19]
video Frontend SOLID || Архитектура во Фронтенде [20]

CSS

habr В ожидании aspect-ratio: все «хаки» для пропорциональных боксов [25]
habr Пришло время попрощаться с единицей измерения px [26]
7 основных понятий CSS Grid Layout с примерами, которые помогут начать работу с гридами [27]
en Обмен данными между CSS и JavaScript с использованием кастомных свойств [28]
en Интерактивное руководство по CSS Transitions [29]
en SmolCSS — небольшой набор сниппетов для современных CSS лейаутов и компонентов [30]
en Управление Z-индексом CSS в крупных проектах [31]
en Prefers-contrast: forced — это ошибка [32]

JavaScript

habr TypeScript: Раскладываем tsconfig по полочкам. Часть 1 [33]
habr Как реализовать drag & drop на чистом JavaScript [34]
habr Решение забавной задачки на JavaScript [35]
en Зависимости JavaScript: все, что вы хотели знать, но боялись спросить [36]
en Программное создание изображений с помощью CSS Painting API [37]

Браузеры

en Safari стал вторым Internet Explorer [59]
Метод идентификации браузера через манипуляции с кэшированием Favicon [60]
Chrome вскоре прекратит работать на процессорах старше 15 лет [61]
Критический баг в Firefox мог привести к выполнению произвольного кода [62]

Занимательное

Атака на зависимости позволила выполнить код на серверах PayPal, Micrоsoft, Apple, Netflix, Uber и ещё 30 компаний [63]
Иконки Favicon научились использовать в качестве Supercookies [64]
Исследование: корпоративных медиа на WordPress стало больше, чем обычных [65]
Google, Microsoft и Huawei объединились для поддержания жизни языка Rust [66]
Проект Tor представил систему анонимных тикетов для GitLab [67]

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

Автор: alexzfort

Источник [71]


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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] JavaScript: #js

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

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

[7] Подкаст «Веб-стандарты» 268. Npm 7, PCM, V8 v8.9, App History API, прагматичные книги, Docker: зачем, как и чьё это дело: https://soundcloud.com/web-standards/episode-268

[8] «Новости 512» от CSSSR: Эра ES-модулей, релизы Node.js LTS, CSS transition, width & height, WebdriverIO 7, Rust Foundation: https://soundcloud.com/csssr/era-es-moduley-relizy-nodejs-lts-css-transition-width-height-webdriverio-7-rust-foundation

[9] HolyJS 2020 Moscow: https://www.youtube.com/playlist?list=PL8sJahqnzh8KkFDsx3tAM8t1kOMn89CwU

[10] Отсобеседование #1: Открытое собеседование frontend разработчика (Middle): https://www.youtube.com/watch?v=BonLyarPpqE

[11] Боль фронтов, или что нам нужно от дизайнеров: https://habr.com/ru/post/541666/

[12] Weekly Platform News: WebKit autofill, использование Cursor Pointer, задержка автоматического проигрывания видео: https://css-tricks.com/weekly-platform-news-webkit-autofill-using-cursor-pointer-delaying-autoplay-videos/

[13] 21 плохая фронтенд-привычка, от которых стоит отказаться в 2021 году: https://dev.to/sachagreif/21-bad-front-end-habits-to-drop-in-2021-1698

[14] Доступ к аппаратному обеспечению в вебе: https://web.dev/devices-introduction/

[15] Разработка производительного пользовательского курсора: https://medium.com/14islands/developing-a-performant-custom-cursor-89f1688a02eb

[16] Управление фокусом в shadow DOM: https://nolanlawson.com/2021/02/13/managing-focus-in-the-shadow-dom/

[17] Почему вы должны превратить свое приложение в PWA: https://blog.logrocket.com/why-you-should-turn-your-app-into-a-pwa/

[18] Отладка WebAssembly с помощью Chrome DevTools : https://blog.bitsrc.io/debugging-webassembly-with-chrome-devtools-99dbad485451

[19] Простая анимация линий при наведения курсора для ссылок : https://tympanus.net/codrops/2021/02/10/simple-css-line-hover-animations-for-links/

[20] Frontend SOLID || Архитектура во Фронтенде: https://webdevblog.ru/frontend-solid-arhitektura-vo-frontende/

[21] Vite против Snowpack: сравнение инструментов сборки фронтенда: https://blog.logrocket.com/vite-vs-snowpack-a-comparison-of-frontend-build-tools/

[22] github1s — Одна секунда, чтобы прочесть код на GitHub с помощью VS Code. : https://github.com/conwnet/github1s

[23] Вступление в новую цифровую эпоху доступности и инклюзивности : https://uxdesign.cc/latest-news-from-the-accessibility-front-legal-and-standards-landscape-5cc0938b3b28

[24] Прекрасная доступность с плавающим фокусом: https://engineering.q42.nl/floating-focus/

[25] В ожидании aspect-ratio: все «хаки» для пропорциональных боксов: https://habr.com/ru/post/542212/

[26] Пришло время попрощаться с единицей измерения px: https://habr.com/ru/company/ruvds/blog/541506/

[27] 7 основных понятий CSS Grid Layout с примерами, которые помогут начать работу с гридами: https://tproger.ru/articles/7-osnovnyh-ponjatij-css-grid-layout-s-primerami-kotorye-pomogut-nachat-rabotu-s-gridami/

[28] Обмен данными между CSS и JavaScript с использованием кастомных свойств: https://christianheilmann.com/2021/02/08/sharing-data-between-css-and-javascript-using-custom-properties/

[29] Интерактивное руководство по CSS Transitions: https://www.joshwcomeau.com/animation/css-transitions/

[30] SmolCSS — небольшой набор сниппетов для современных CSS лейаутов и компонентов: https://smolcss.dev/

[31] Управление Z-индексом CSS в крупных проектах: https://www.smashingmagazine.com/2021/02/css-z-index-large-projects/

[32] Prefers-contrast: forced — это ошибка: https://kilianvalkhof.com/2021/css-html/prefers-contrast-forced-is-a-mistake/

[33] TypeScript: Раскладываем tsconfig по полочкам. Часть 1: https://habr.com/ru/post/542234/

[34] Как реализовать drag & drop на чистом JavaScript: https://habr.com/ru/company/htmlacademy/blog/541972/

[35] Решение забавной задачки на JavaScript: https://habr.com/ru/company/vdsina/blog/541534/

[36] Зависимости JavaScript: все, что вы хотели знать, но боялись спросить : https://blog.bitsrc.io/everything-you-ever-wanted-to-know-but-were-afraid-to-ask-about-javascript-dependencies-175220f0dcfb

[37] Программное создание изображений с помощью CSS Painting API : https://blog.bitsrc.io/programmatically-generate-images-with-css-painting-api-3b1a860dae3b

[38] Инверсия и внедрение зависимостей: https://webdevblog.ru/inversiya-i-vnedrenie-zavisimostej/

[39] 7 вопросов для собеседования по замыканиям в JavaScript.: https://dmitripavlutin.com/javascript-closures-interview-questions/

[40] Подробное руководство по выражениям и операторам JavaScript : https://blog.logrocket.com/a-comprehensive-guide-to-javascript-expressions/

[41] Кому с Redux жить хорошо: https://habr.com/ru/company/manychat/blog/541794/

[42] 12 шагов, как подготовить Junior React Developer к работе на проекте на примере To-Do List App: https://dou.ua/lenta/columns/12-steps-for-junior-react-developer/

[43] Изучение методов кэширования в React : https://medium.com/better-programming/exploring-caching-techniques-in-react-d30bbb78d54d

[44] 6 лучших практик React на 2021 год: https://blog.asayer.io/6-react-best-practices-for-2021

[45] Remotion — Создание анимированной графики в React: https://www.remotion.dev/

[46] Реализация шаблона Builder во Vue.js, часть 1: Списки: https://webdevblog.ru/realizaciya-shablona-builder-vo-vue-js-chast-1-spiski/

[47] Реализация шаблона Builder во Vue.js, часть 2: Формы: https://webdevblog.ru/realizaciya-shablona-builder-vo-vue-js-chast-2-formy/

[48] Angular — четыре старомодных практики, которые НЕ следует переносить в Angular: https://lukeliutingchun.medium.com/angular-four-old-fashioned-practices-that-you-should-not-carry-forward-to-angular-3c7f77d3436

[49] Ппредварительная бета-версия Angular 12: https://www.infoworld.com/article/3607428/angular-12-beta-preview-arrives.html#tk.rss_javascript

[50] Оптимизация приложений на Angular: https://nichola.dev/optimizing-angular-applications/

[51] Руководство по Angular Routing: как оптимизировать навигацию в приложении : https://www.educative.io/blog/angular-routing-guide

[52] Пользовательские операторы RxJS: https://indepth.dev/posts/1421/rxjs-custom-operators

[53] Легкая настройка TailwindCSS в Angular : https://dev.to/angular/setup-tailwindcss-in-angular-the-easy-way-1i5l

[54] The Ember Times — Issue No. 173: https://blog.emberjs.com/the-ember-times-issue-173/

[55] Отформатируйте шаблоны Glimmer с помощью Prettier: https://dev.to/jelhan/format-glimmer-templates-with-prettier-ipa

[56] Переиспользуемый компонент Svelte: чтобы никому не было больно: https://habr.com/ru/post/541834/

[57] Handsfree.js — Быстро интегрируйте отслеживание лица, рук и / или позы в свои фронтенд-проекты.: https://handsfree.js.org/

[58] Mineflayer — Создавайте Minecraft-ботов с помощью мощного, стабильного и высокоуровневого JavaScript API.: https://mineflayer.prismarine.js.org/#/

[59] Safari стал вторым Internet Explorer: https://medium.com/javascript-in-plain-english/safari-has-become-the-second-internet-explorer-e2c2dd114837

[60] Метод идентификации браузера через манипуляции с кэшированием Favicon: https://www.opennet.ru/opennews/art.shtml?num=54553

[61] Chrome вскоре прекратит работать на процессорах старше 15 лет: https://itc.ua/blogs/chrome-vskore-prekratit-rabotat-na-proczessorah-starshe-15-let/

[62] Критический баг в Firefox мог привести к выполнению произвольного кода: https://xakep.ru/2021/02/11/firefox-angle-bug/

[63] Атака на зависимости позволила выполнить код на серверах PayPal, Micrоsoft, Apple, Netflix, Uber и ещё 30 компаний: https://www.opennet.ru/opennews/art.shtml?num=54566

[64] Иконки Favicon научились использовать в качестве Supercookies: https://tproger.ru/news/ikonki-favicon-nauchilis-ispolzovat-v-kachestve-supercookies/

[65] Исследование: корпоративных медиа на WordPress стало больше, чем обычных : https://vc.ru/media/206662-issledovanie-korporativnyh-media-na-wordpress-stalo-bolshe-chem-obychnyh

[66] Google, Microsoft и Huawei объединились для поддержания жизни языка Rust: https://tproger.ru/news/google-microsoft-i-huawei-obedinilis-dlja-podderzhanija-zhizni-jazyka-rust/

[67] Проект Tor представил систему анонимных тикетов для GitLab: https://www.opennet.ru/opennews/art.shtml?num=54571

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

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

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

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