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

---

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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] Javascript: #js

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

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

[7] #42 – Андрей Романов о секретах развития frontend-сообщества For Web и карьере в 20 лет: https://soundcloud.com/frontend-weekend/fw-42

[8] #40 Парадигменная вакханалия: https://soundcloud.com/frontend_u/e40

[9] Ночной фронтенд #24 — JavaScript, которого не было: https://medium.com/devschacht/nightly-24-f3e010b3298

[10] #39 — TypeScript 20/80: http://5minreact.ru/39-typescript-20-80/

[11] #40 — Яндекс Трекер на фоне YouTrack: http://5minreact.ru/40-yandex-tracker-vs-youtrack/

[12] #41 — Дэн Абрамов: Beyond React 16: http://5minreact.ru/41-dan-abramov-beyond-react-16/

[13] «Самолётики, кривые, кватернионы»: https://www.youtube.com/watch?v=d3JGRn0llqM

[14] «Python vs. JS — Сколько бы вы могли заработать на покупке Bitcoin с машиной времени?»: https://www.youtube.com/watch?v=bjg5UWcl_oo

[15] Итоги февральского PiterJS №22: https://medium.com/piterjs/piterjs22-c35933c9d88a

[16] 39 видео с JSConf.Asia 2018 : https://www.youtube.com/playlist?list=PL37ZVnwpeshFqN5dcZ704lxI3F5iHDYkl

[17] Улучшат ли ускоренные мобильные страницы ранжирование в Google и как настроить тест AMP: https://vc.ru/34030-uluchshat-li-uskorennye-mobilnye-stranicy-ranzhirovanie-v-google-i-kak-nastroit-test-amp

[18] Новости AMP в заметках Криса Койера: https://css-tricks.com/amp-news/

[19] frontend-case-studies: https://github.com/andrew--r/frontend-case-studies

[20] Как я превратился из графического дизайнера в разработчика фронтенда за 5 месяцев: https://medium.freecodecamp.org/graphic-designer-to-front-end-developer-7be7bfd6a46c

[21] Теперь нелегально иметь недоступный сайт в Норвегии — и это хорошая новость для всех нас: https://medium.com/confrere/its-illegal-to-have-an-inaccessible-website-in-norway-and-that-s-good-news-for-all-of-us-b59a9e929d54

[22] O API — альтернатива REST API: https://hackernoon.com/o-api-an-alternative-to-rest-apis-e9a2ed53b93c

[23] Google запустил инструмент для сравнения скорости сайта с другими ресурсами: https://www.searchengines.ru/speed-compare.html

[24] Новая обзорная статья от Google об инструментах для работы с веб-производительностью : https://developers.google.com/web/fundamentals/performance/speed-tools/

[25] Улучшение производительности страницы с помощью Chrome DevTools : https://www.youtube.com/watch?v=yRrrL0Mg1pM

[26] Оптимизация производительности React – 12 инструментов и советов : https://www.keycdn.com/blog/react-performance/

[27] Вы определенно захотите оптимизировать загрузку вашего сайта. И вот как это сделать : https://medium.freecodecamp.org/website-loading-speed-optimization-in-2018-bananas-e66cc85df8dd

[28] Ленивая загрузка изображений для улучшения производительности с помощью Intersection Observer: https://scotch.io/tutorials/lazy-loading-images-for-performance-using-intersection-observer

[29] Начало: https://felixit.blog/2018/03/04/istoria-csso-nachalo/

[30] продолжение: https://felixit.blog/2018/03/04/istoria-csso-prodolzhenie/

[31] завершение: https://felixit.blog/2018/03/05/istoria-csso-zavershenie/

[32] Как добавить линтинг JavaScript в ваш проект с помощью ESLint и Gulp: http://tech.uaccount.uk/2018/02/28/how-to-add-javascript-linting-to-your-project-using-eslint-and-gulp.html

[33] Chrome 65 — что нового в DevTools: https://www.youtube.com/watch?v=D1pV7ermy6w

[34] Что нового в DevTools (Chrome 66): https://developers.google.com/web/updates/2018/02/devtools

[35] Пунктирные вау-эффекты: о магии простыми словами: https://habrahabr.ru/post/349988/

[36] Еженедельная подборка красивых эффектов на CSS/SVG/JS #72: http://css-live.ru/cssjssvg-s-podvypodvertom/ezhenedelnaya-podborka-krasivyx-effektov-na-css-svg-js-72.html

[37] Красный проявитель: иллюзии в вебе часть 1: https://danielcwilson.com/blog/2018/02/optical-fun-red-reveal/

[38] 30 секунд CSS: https://habrahabr.ru/company/mailru/blog/350160/

[39] Использование CSS-grid при проектировании пользовательских интерфейсов: https://habrahabr.ru/company/ruvds/blog/350166/

[40] Селекторы CSS и их применение в автоматизации тестирования Программного Обеспечения: https://habrahabr.ru/company/otus/blog/350368/

[41] Google: GoogleBot не может сканировать пользовательские CSS-свойства: https://www.searchengines.ru/googlebot-css.html

[42] Как использовать вариативные шрифты в реальном мире: http://css-live.ru/articles/kak-ispolzovat-variativnye-shrifty-v-realnom-mire.html

[43] Отзывчивые компоненты: решение проблемы выражений от контейнера: http://css-live.ru/javascript/otzyvchivye-komponenty-reshenie-problemy-vyrazhenij-ot-kontejnera.html

[44] Сторонний CSS небезопасен: http://css-live.ru/articles-css/storonnij-css-nebezopasen.html

[45] CSS крадёт ваши данные: https://hackaday.com/2018/02/25/css-steals-your-web-data/

[46] Менее знакомые особенности CSS и продвинутые советы: https://medium.com/@peedutuisk/lesser-known-css-quirks-oddities-and-advanced-tips-css-is-awesome-8ee3d16295bb

[47] Доказательство того, что CSS Grid готовы к продакшену в перспективе: https://julian.is/article/css-grid-ready-for-production/

[48] Использование Sass для контроля области видимости с наименованием BEM: https://css-tricks.com/using-sass-control-scope-bem-naming/

[49] Изучение CSS переменных за 5 минут: http://jem-space.ru/learn-css-variables-in-5-minutes/

[50] Время переменных: https://medium.com/@juwain/%D0%B2%D1%80%D0%B5%D0%BC%D1%8F-%D0%BF%D0%B5%D1%80%D0%B5%D0%BC%D0%B5%D0%BD%D0%BD%D1%8B%D1%85-429d9dc4499

[51] мышление: http://www.braintools.ru

[52] Отзывчивый вертикальный ритм с помощью пользовательских свойств CSS и CSS Calc: https://zellwk.com/blog/responsive-vertical-rhythm/

[53] Как сделать отзывчивость супер простой с помощью CSS переменных: https://medium.freecodecamp.org/how-to-make-responsiveness-super-simple-with-css-variables-8c90ebf80d7f

[54] Случайные числа не случайны: https://medium.com/@frontman/%D1%81%D0%BB%D1%83%D1%87%D0%B0%D0%B9%D0%BD%D1%8B%D0%B5-%D1%87%D0%B8%D1%81%D0%BB%D0%B0-%D0%BD%D0%B5-%D1%81%D0%BB%D1%83%D1%87%D0%B0%D0%B9%D0%BD%D1%8B-252e08e60828

[55] Полное руководство по JavaScript SEO: https://www.elephate.com/blog/ultimate-guide-javascript-seo/

[56] TypeScript — JavaScript с суперспособностями: https://medium.freecodecamp.org/typescript-javascript-with-super-powers-a333b0fcabc9

[57] Пожалуйста, перестаньте использовать console.log() для отладки, он сломан…: https://hackernoon.com/please-stop-using-console-log-its-broken-b5d7d396cf15

[58] Вы не знаете JS: Асинхронность и Производительность: https://github.com/devSchacht/You-Dont-Know-JS/blob/master/async%20%26%20performance/ch3.md

[59] Service Workers. Web Push и где они обитают: https://habrahabr.ru/company/2gis/blog/350034/

[60] Как работает JS: сервис-воркеры: https://habrahabr.ru/company/ruvds/blog/349858/

[61] Как работает JavaScript: механика веб пуш уведомлений: https://blog.sessionstack.com/how-javascript-works-the-mechanics-of-web-push-notifications-290176c5c55d

[62] Создатель Vue.js отвечает Хабру: https://habrahabr.ru/post/350290/

[63] Часть 1/2: https://medium.com/devschacht/%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-mevn-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F-%D1%87%D0%B0%D1%81%D1%82%D1%8C-1-2-9ad714260037

[64] Часть 2/2: https://medium.com/devschacht/%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-mevn-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F-%D1%87%D0%B0%D1%81%D1%82%D1%8C-2-2-f0bd9962acf2

[65] Начинаем работать с Webpack 4 и VueJs — руководство для быстрого старта: https://medium.com/justfrontendthings/starting-with-webpack-4-and-vuejs-a-quick-start-tutorial-4a244410d55e

[66] Давайте создадим кастомные Vue Router: https://css-tricks.com/build-a-custom-vue-router/

[67] Создание бессерверной CMS на Vue.js: https://css-tricks.com/building-serverless-cms-powered-vue-js/

[68] vueds — опенсорсный инструмент для создания стайлгайдов на Vue.js: https://vueds.com/

[69] Как создать доступный компонент Autocomplete на Vue.js: https://alligator.io/vuejs/vue-a11y-autocomplete/

[70] Разрабатываем игру на SVG + React. Часть 1: https://habrahabr.ru/post/350274/

[71] Создание клона Airbnb с помощью React и ElasticSearch: https://scotch.io/tutorials/build-an-airbnb-clone-with-react-and-elasticsearch

[72] react-morph: https://github.com/brunnolou/react-morph

[73] Редизайн Redux: https://hackernoon.com/redesigning-redux-b2baee8b8a38

[74] Первый взгляд на Async React + Apollo: https://dev-blog.apollodata.com/a-first-look-at-async-react-apollo-10a82907b48e

[75] 9 инструментов React для организации работы над компонентами: https://blog.bitsrc.io/9-tools-and-libraries-to-boost-your-react-component-workflow-6ff4b49511c2

[76] Структуризация проектов и наименование компонентов в React: https://hackernoon.com/structuring-projects-and-naming-components-in-react-1261b6e18d76

[77] 8 условных методов рендеринга в React : https://blog.logrocket.com/conditional-rendering-in-react-c6b0e5af381e

[78] «Быстрый взгляд на React после релиза 16-й версии»: https://reactjs.org/blog/2018/03/01/sneak-peek-beyond-react-16.html

[79] Часть 1. Введение.: https://medium.com/@independbear/%D1%80%D0%B5%D0%B0%D0%BA%D1%82%D0%B8%D0%B2%D0%BD%D1%8B%D0%B5-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%B0-angular-ngrx-%D1%87%D0%B0%D1%81%D1%82%D1%8C-1-cb7b4f2852dc

[80] Часть 2. Store.: https://medium.com/@independbear/%D1%80%D0%B5%D0%B0%D0%BA%D1%82%D0%B8%D0%B2%D0%BD%D1%8B%D0%B5-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%B0-angular-ngrx-%D1%87%D0%B0%D1%81%D1%82%D1%8C-2-1412bc9adf17

[81] Часть 3. Effects.: https://medium.com/@independbear/%D1%80%D0%B5%D0%B0%D0%BA%D1%82%D0%B8%D0%B2%D0%BD%D1%8B%D0%B5-%D0%BF%D1%80%D0%B8%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%B0-angular-ngrx-%D1%87%D0%B0%D1%81%D1%82%D1%8C-3-effects-6f4b34dfa289

[82] AngularJS: последний релиз: https://www.telerik.com/blogs/angularjs-the-final-release

[83] Angular InstantSearch — новая библиотека от algolia для работы с интерфейсами поиска в Angular: https://blog.algolia.com/bringing-search-to-angular/

[84] Angular грядёт: подготовка к апгрейду: https://bytes.grubhub.com/angular-is-coming-preparing-the-upgrade-be9ec8954ea2

[85] Введение в NGRX Actions 3.0: https://medium.com/@amcdnl/introducing-ngrx-actions-3-0-557f6ce16678

[86] termtools: https://github.com/NascHQ/termtools

[87] Delighters.JS: https://q42.github.io/delighters/

[88] flatbush: https://github.com/mourner/flatbush

[89] prompts: https://github.com/terkelg/prompts

[90] Mozilla прекращает поддержку бета-версий в каталоге дополнений для Firefox: http://www.opennet.ru/opennews/art.shtml?num=48172

[91] В Firefox 60 может измениться возможность индивидуального управления Cookie: http://www.opennet.ru/opennews/art.shtml?num=48148

[92] С 2014 года доля пользователей Chrome, использующих Flash, снизилась с 80% до 8%: http://www.opennet.ru/opennews/art.shtml?num=48163

[93] Ваш приватный режим браузера не настолько приватен, как хотелось бы: https://medium.com/popular-science/your-private-browsing-isnt-as-incognito-as-you-want-it-to-be-a81eac1fb7a0

[94] В Slack добавлена интеграция для бесшовной работы с GitHub: https://tproger.ru/news/slack-plus-github/

[95] Microsoft планирует взимать плату за некоторые премиальные шрифты: http://microsoftportal.net/windows-9/9329-microsoft-planiruet-vzimat-platu-za-nekotorye-premialnye-shrifty.html

[96] Google представила кроссплатформенный фреймворк для разработки пользовательских интерфейсов Flutter: https://tproger.ru/news/flutter-beta-1/

[97] Google открыла доступ к самой большой базе мировых достопримечательностей Google-Landmarks: https://tproger.ru/news/google-landmarks/

[98] Intel, Microsoft и другие объяснили властям, почему возникли проблемы с исправлением Spectre и Meltdown: https://xakep.ru/2018/02/27/intel-microsoft-respond-to-lawmakers/

[99] На GitHub обрушилась DDoS-атака мощностью 1,35 Тб/сек, и благодарить за это нужно Memcached: https://xakep.ru/2018/03/02/github-memcached-ddos/

[100] Два года, которые потрясли Facebook: https://vc.ru/33767-dva-goda-kotorye-potryasli-facebook

[101] В AdBlock добавили функцию кэширования популярных JS-библиотек: https://tproger.ru/news/adblock-caches-js-libraries/

[102] Google выпустила собственную альтернативу Slack: https://tproger.ru/news/google-slack-competitor/

[103] Билл Гейтс на Reddit AMA: об опасности криптовалют, недоверии к Hyperloop Илона Маска и президентских амбициях (их нет): https://itc.ua/news/bill-geyts-na-reddit-ama-ob-opasnosti-kriptovalyut-nedoverii-k-hyperloop-ilona-maska-i-prezidentskih-ambitsiyah-ih-net/

[104] Java EE переименован в Jakarta EE: http://www.opennet.ru/opennews/art.shtml?num=48194

[105] Дайджест за прошлую неделю: https://habrahabr.ru/company/zfort/blog/349930/

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

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

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

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