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

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

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

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

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

Медиа

podcast Подкаст «Веб-стандарты» №211. Софт-скилы, футбол и жизнь без фронтенда, веб-компоненты, React, гриды, перфоманс, дайвёрсити [6]
podcast Подкаст «Фронтенд Юность (18+)» #121: Из чего состоит JavaScript [7]
podcast UnderJS Podcast #13 — Андрей Ситник про Logux, PostCSS и человечный фронтенд [Ламповый] [8]
podcast Подкаст CSSSR, Argumentarium — Reatom, Redux и Effector [9]
podcast pro​Conf #44 [Special] ЛУЧШИЕ ДОКЛАДЫ 2019 [10]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №397 (6 — 12 января 2020) - 7 Веб-разработка

en Начало работы с тестированием фронтенда [11]
en Отчет по безопасности npm 2019 [12]
en Простые плейсхолдеры для изображений с помощью SVG [13]
en Почему вы должны выбрать <article> вместо <section> в HTML5 [14]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №397 (6 — 12 января 2020) - 22 CSS

habr Клади плитку эффективно ( Про CSS, SVG, pattern и другое) [25]
habr Свойства Min и Max width/height в CSS [26]
Стандарт CSS для Masonry-раскладки: от идеи — к первым конкретным наработкам [27]
en prefers-color-scheme: CSS Media Query [28]
en Как совмещать элементы в CSS [29]
en Перемещение (или нет) с помощью CSS Motion Path [30]
en Карусель на CSS [31]
en Многопозиционные ползунки: общий случай [32], случай с двумя позициями [33]
en Использование изингов не только для CSS transitions [34]
en Понимание CSS Grid: Grid Lines [35]
en 7 свойств CSS, о которых вы не знали [36]
video en 13 способов вертикального центрирования в 2020 [37]
en Скрытие элементов в вебе [38]

JavaScript

habr Что добавят в JavaScript уже в 2020 году [39]
habr Модальные окна, которые мы заслужили [40]
en Восходящие звезды JavaScript 2019 [41]
en Сколько платить JavaScript-разработчикам в 2020 году [42]
en Как перевести свой проект на TypeScript в своем темпе [43]
en Hopa — CLI без конфигов, запускающая JavaScript и TypeScript [44]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №397 (6 — 12 января 2020) - 66 Браузеры

Релиз Firefox 72 [70]
Firefox 72, детали для разработчиков [71]
Chrome, следом за Firefox, добавит защиту от назойливых уведомлений [72]
Mozilla тестирует систему голосового управления Firefox Voice [73]
Слухи о смерти Internet Explorer сильно преувеличены. Windows 10 ставит рекорд по совместимости [74]
en Firefox 72 — наша первая песня 2020 года [75]
en Конец инди веб-браузеров: вы (не) можете конкурировать [76]
en Почему вам давно пора было отказаться от поддержки IE... [77]

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

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

Автор: alexzfort

Источник [81]


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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] JavaScript: #js

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

[6] Подкаст «Веб-стандарты» №211. Софт-скилы, футбол и жизнь без фронтенда, веб-компоненты, React, гриды, перфоманс, дайвёрсити: https://soundcloud.com/web-standards/episode-211

[7] Подкаст «Фронтенд Юность (18+)» #121: Из чего состоит JavaScript: https://soundcloud.com/frontend_u/e121

[8] UnderJS Podcast #13 — Андрей Ситник про Logux, PostCSS и человечный фронтенд [Ламповый] : https://soundcloud.com/underjs/13-andrey-sitnik-pro-logux-postcss-i-chelovechnyy-frontend-lampovyy

[9] Подкаст CSSSR, Argumentarium — Reatom, Redux и Effector : https://soundcloud.com/csssr/argumentarium-reatom-redux-i-effector

[10] pro​Conf #44 [Special] ЛУЧШИЕ ДОКЛАДЫ 2019: https://soundcloud.com/proconf/44-special-luchshie-doklady-2019

[11] Начало работы с тестированием фронтенда: https://www.javascriptjanuary.com/blog/getting-started-with-front-end-testing

[12] Отчет по безопасности npm 2019 : https://blog.npmjs.org/post/190109399410/npm-security-2019-in-review

[13] Простые плейсхолдеры для изображений с помощью SVG: https://cloudfour.com/thinks/simple-svg-placeholder/

[14] Почему вы должны выбрать <article> вместо <section> в HTML5: https://www.smashingmagazine.com/2020/01/html5-article-section/

[15] Быстрая загрузка страниц на самых простых дешёвых телефонах: https://habr.com/ru/company/ruvds/blog/482470/

[16] Как Google учитывает показатели производительности веб страницы при ранжировании результатов поиска?: https://www.youtube.com/watch?v=l36z3il629s

[17] Front-End Performance Checklist 2020 [PDF, Apple Pages, MS Word]: https://www.smashingmagazine.com/2020/01/front-end-performance-checklist-2020-pdf-pages/

[18] Уменьшение HTML загрузки с помощью сервис-воркеров: https://philipwalton.com/articles/smaller-html-payloads-with-service-workers/

[19] Год для веб-производительности: 2019 : https://www.machmetrics.com/speed-blog/web-performance-year-review-2019/

[20] Бюджеты производительности, прагматично : https://csswizardry.com/2020/01/performance-budgets-pragmatically/

[21] Что я узнал, оптимизируя наше время сборки: https://dutzi.party/optimizing-our-build-time/

[22] Подборка креативных демок «Awesome Demos Roundup #12»: https://tympanus.net/codrops/2020/01/08/awesome-demos-roundup-12/

[23] Как анимировать SVG подпись: https://www.silvestar.codes/articles/how-to-animate-svg-signature/

[24] Игра с текстурной проекцией в Three.js : https://tympanus.net/codrops/2020/01/07/playing-with-texture-projection-in-three-js/

[25] Клади плитку эффективно ( Про CSS, SVG, pattern и другое): https://habr.com/ru/post/483470/

[26] Свойства Min и Max width/height в CSS: https://habr.com/ru/post/483634/

[27] Стандарт CSS для Masonry-раскладки: от идеи — к первым конкретным наработкам: https://css-live.ru/vecssti-s-polej/standart-css-dlya-masonry-raskladki-ot-idei-k-pervym-konkretnym-narabotkam.html

[28] prefers-color-scheme: CSS Media Query: https://davidwalsh.name/prefers-color-scheme

[29] Как совмещать элементы в CSS : https://css-tricks.com/how-to-stack-elements-in-css/

[30] Перемещение (или нет) с помощью CSS Motion Path: https://danielcwilson.com/blog/2020/01/motion-path-quirks/

[31] Карусель на CSS : https://css-tricks.com/css-only-carousel/

[32] общий случай: https://css-tricks.com/multi-thumb-sliders-general-case/

[33] случай с двумя позициями: https://css-tricks.com/multi-thumb-sliders-particular-two-thumb-case/

[34] Использование изингов не только для CSS transitions : https://kilianvalkhof.com/2020/css-html/using-easing-for-more-than-just-css-transitions/?ref=heydesigner

[35] Понимание CSS Grid: Grid Lines: https://www.smashingmagazine.com/2020/01/understanding-css-grid-lines/

[36] 7 свойств CSS, о которых вы не знали : https://dev.to/tlakomy/7-css-properties-you-had-no-idea-about-4e75

[37] 13 способов вертикального центрирования в 2020: https://www.youtube.com/watch?v=ngT6ZiInXDY

[38] Скрытие элементов в вебе : https://ishadeed.com/article/hiding-web/

[39] Что добавят в JavaScript уже в 2020 году: https://habr.com/ru/post/483118/

[40] Модальные окна, которые мы заслужили: https://habr.com/ru/post/483114/

[41] Восходящие звезды JavaScript 2019 : https://risingstars.js.org/2019/en/

[42] Сколько платить JavaScript-разработчикам в 2020 году: https://medium.com/javascript-scene/what-to-pay-javascript-developers-in-2020-2292eb346f3b

[43] Как перевести свой проект на TypeScript в своем темпе : https://www.twilio.com/blog/move-to-typescript

[44] Hopa — CLI без конфигов, запускающая JavaScript и TypeScript: https://krasimirtsonev.com/blog/article/hopa-javascript-typescript-runner

[45] Пять интересных способов использования Array.reduce() (и один скучный путь): https://habr.com/ru/post/483182/

[46] Реактивность в веб-фреймворках (часть 1): https://lihautan.com/reactivity-in-web-frameworks-the-when/

[47] Понимание Async Await: https://css-tricks.com/understanding-async-await/

[48] JavaScript и window.postMessage(): https://medium.com/javascript-in-plain-english/javascript-and-window-postmessage-a60c8f6adea9

[49] NaN в JavaScript: https://dmitripavlutin.com/nan-in-javascript/

[50] Beautiful React Hooks — Коллекция красивых и (надеюсь) полезных хуков React для ускорения разработки ваших компонентов и хуков: https://github.com/beautifulinteractions/beautiful-react-hooks

[51] Развенчание мифа: Accessibility и React : https://www.deque.com/blog/debunking-the-myth-accessibility-and-react/

[52] От create-react-app к PWA: https://blog.logrocket.com/from-create-react-app-to-pwa/

[53] Новая документация Next.js : https://nextjs.org/blog/new-documentation

[54] ipod-classic-js — iPod Classic, созданный с использованием React Hooks, TypeScript и GraphQL: https://github.com/tvillarete/ipod-classic-js

[55] craft.js — React Framework для создания расширяемых редакторов страниц с drag and drop: https://github.com/prevwong/craft.js

[56] 5 дел, которые можно сделать для того, чтобы подготовиться к приходу Vue 3.0: https://habr.com/ru/company/ruvds/blog/482466/

[57] Vue для самых маленьких a.k.a небольшой блог по всем канонам: https://habr.com/ru/post/483064/

[58] Использование IndexedDB с Vue.js: https://webdevblog.ru/ispolzovanie-indexeddb-s-vue-js/

[59] Анонс Villus — крошечный и быстрый клиент GraphQL для Vue.js : https://logaretm.com/blog/2020-01-11-announcing-villus/

[60] Обработка событий с помощью Vue.js : https://vuejsdevelopers.com/2020/01/06/handling-events-vue-js/

[61] Приключения с функцией рендера Vue : https://dev.to/herrbertling/adventures-in-vue-s-render-function-4id7

[62] Полное руководство по созданию полноценного мультиязычного сайта на Nuxt.js : https://dev.to/storyblok/the-complete-guide-to-build-a-full-blown-multilanguage-website-with-nuxt-js-8cd

[63] vue-kinesis — Простые в использовании компоненты Vue.js для создания интерактивных анимаций : https://www.aminerman.com/kinesis/#/

[64] Лучшие новые возможности Angular 9 : https://www.telerik.com/blogs/top-new-features-of-angular-9

[65] Практическое руководство по Angular: Data Binding & Directive : https://www.telerik.com/blogs/a-practical-guide-to-angular-data-binding-directive

[66] Как создать и развернуть приложение Angular Material: https://www.smashingmagazine.com/2020/01/angular-8-material-application-netlify/

[67] Scully, первый генератор статических сайтов для Angular: https://medium.com/angular-in-depth/scully-the-static-site-generator-for-angular-d0608cb028ae

[68] The Ember Times — Выпуск 130: https://habr.com/ru/post/483630/

[69] 6 советов по переходу на CSS-модули в Ember : https://ilyaradchenko.com/6-tips-for-transitioning-to-ember-css-modules/

[70] Релиз Firefox 72: https://www.opennet.ru/opennews/art.shtml?num=52144

[71] Firefox 72, детали для разработчиков: https://tanalin.com/blog/2020/01/firefox-72/

[72] Chrome, следом за Firefox, добавит защиту от назойливых уведомлений: https://www.opennet.ru/opennews/art.shtml?num=52158

[73] Mozilla тестирует систему голосового управления Firefox Voice: https://www.opennet.ru/opennews/art.shtml?num=52172

[74] Слухи о смерти Internet Explorer сильно преувеличены. Windows 10 ставит рекорд по совместимости: https://www.ixbt.com/news/2020/01/12/internet-explorer-windows-10.html

[75] Firefox 72 — наша первая песня 2020 года : https://hacks.mozilla.org/2020/01/firefox-72-our-first-song-of-2020/

[76] Конец инди веб-браузеров: вы (не) можете конкурировать : https://blog.samuelmaddock.com/posts/the-end-of-indie-web-browsers/

[77] Почему вам давно пора было отказаться от поддержки IE...: https://areknawo.com/why-you-should-have-ditched-ie-support-long-ago/

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

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

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

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