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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017)

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017) - 1

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

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

Media

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017) - 20 CSS

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017) - 36 JavaScript

Браузеры

Дайджест свежих материалов из мира фронтенда за последнюю неделю №256 (27 марта — 2 апреля 2017) - 68 Занимательное

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

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

Автор: Zfort Group

Источник [107]


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

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

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

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

[2] CSS: #css

[3] Javascript: #js

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

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

[6] Пробуем делать web-frontend на Rust (WebAssembly): https://habrahabr.ru/post/325008/

[7] Гид по верстке адаптивных писем: https://habrahabr.ru/company/netologyru/blog/324970/

[8] Знакомьтесь, вариативные шрифты (variable fonts)!: https://type.today/ru/journal/opentype_variables

[9] Awesome Newsletters: подборка еженедельных рассылок на тему веб-разработки: https://github.com/webpro/awesome-newsletters

[10] Бесплатные инструменты сжатия изображений для ускорения работы сайта: https://habrahabr.ru/company/hosting-cafe/blog/325262/

[11] Preload, Prefetch и приоритеты в Chrome: https://medium.com/dev-channel/preload-prefetch-and-priorities-in-chrome-776165961bbf

[12] Повышение скорости сайта с помощью машинного обучения: https://hackernoon.com/speed-up-your-site-with-a-little-machine-learning-fa9eb7c86dbb

[13] Разработка под мобильные: RWD, PWA, AMP или Instant Articles?: https://www.smashingmagazine.com/2017/03/building-for-mobile-rwd-pwa-amp-instant-articles/

[14] Как выбрать идеальный формат изображения для оптимизации вашего сайта: https://www.sitepoint.com/how-to-select-the-perfect-image-format-to-optimize-your-website/

[15] Являются ли SVG изображения хорошим вариантом для производительности сайта?: https://www.sitepoint.com/svg-good-for-website-performance/

[16] Для веб-разработчиков скорость — это новое SEO: https://www.entrepreneur.com/article/290117

[17] AMP: breaking news. О негативных аспектах использования Google AMP : https://trib.tv/2017/03/31/amp-breaking-news/

[18] Обстоятельный обзор WebPack: https://www.keycdn.com/blog/webpack/

[19] Ускоряем разработку темы под WordPress с помощью Gulp: https://www.sitepoint.com/fast-gulp-wordpress-theme-development-workflow/

[20] Почему сейчас самое время бизнесу серьезно задуматься о Progressive Web Apps: http://www.techrepublic.com/article/why-its-time-for-businesses-to-get-serious-about-progressive-web-apps/

[21] Как создать эффект сдвигающегося подчёркивания с CSS и JavaScript: https://webdesign.tutsplus.com/tutorials/how-to-build-a-shifting-underline-hover-effect-with-css-and-javascript--cms-28510

[22] Экспериментальный макет демонстрации 3D комнаты: https://tympanus.net/codrops/2017/03/30/experimental-3d-room-exhibition-layout/

[23] Подкаст Веб-стандарты, Выпуск №61: https://soundcloud.com/web-standards/episode-61

[24] Подкаст radiojs, Выпуск №48:: https://radiojs.ru/2017/04/radiojs-48/

[25] Подкаст Фронтёрки 003: http://www.fronterki.fm/post/158961668741/sitnik

[26] #8 — Plan for Addons in React 16: http://5minreact.ru/8-plan-for-addons-in-react-16/

[27] #9 — Lifting State Up Example Explained: http://5minreact.ru/9-lifting-state-up-example-explained/

[28] «Moscow JS» в офисе Superjob: https://www.youtube.com/watch?v=tS6XHqRhpEQ&feature=youtu.be

[29] CSS-анимация подождет: https://habrahabr.ru/post/325342/

[30] Пользовательские свойства CSS в качестве API: http://zmeika.name/2017/03/31/custom-properties-as-api.html

[31] CSS Grid на практике: добавляем гриды к существующему дизайну: http://css-live.ru/articles/css-grid-na-praktike-dobavlyaem-gridy-k-sushhestvuyushhemu-dizajnu.html

[32] Месяц CSS-гридов: первые итоги: http://css-live.ru/vecssti-s-polej/mesyac-css-gridov-pervye-itogi.html

[33] Красивое выравнивание блоков по резиновой сетке. По-новому: http://css-live.ru/css/responsive-grid-css-grid-layout-auto-fill.html

[34] Знакомство с CSS Grid Layout: http://css-live.ru/articles/znakomstvo-s-css-grid-layout.html

[35] CSS Grid и Flexbox: сравнение на практике: http://htmlbook.ru/blog/css-grid-i-flexbox-sravnenie-na-praktike

[36] Создание сложных макетов с помощью CSS Grid Layout: https://egghead.io/courses/master-css-grid-layout

[37] 3 свойства CSS Grid, которые заставляют мое сердце трепетать: https://una.im/css-grid/

[38] Простой визуальный онлайн-билдер для облегчения работы над CSS кридами: http://codepen.io/anthonydugois/full/RpYBmy

[39] Заменит ли CSS Grid Flexbox? : https://css-tricks.com/css-grid-replace-flexbox/

[40] CSS Custom Properties в Microsoft Edge: https://blogs.windows.com/msedgedev/2017/03/24/css-custom-properties/

[41] Приручаем непослушные стили с помощью этих трех CSS методологий: https://www.sitepoint.com/tame-unruly-style-sheets-three-css-architecture-methodologies/

[42] Глубокое погружение в CSS: matrix3d() для идеальной кастомной полосы прокрутки: https://developers.google.com/web/updates/2017/03/custom-scrollbar

[43] Единицы вьюпорта в CSS: быстрый старт: https://www.sitepoint.com/css-viewport-units-quick-start/

[44] С CSS все хорошо, просто он действительно сложный: https://medium.com/@jdan/css-is-fine-its-just-really-hard-638da7a3dce0

[45] Stylelint Config Generator: https://maximgatilin.github.io/stylelint-config/

[46] Пружинящая анимация в CSS: https://medium.com/@dtinth/spring-animation-in-css-2039de6e1a03

[47] Responsive font calculator: генерация отзывчивых значений для шрифтов : https://websemantics.uk/tools/responsive-font-calculator/

[48] О новом псевдо-классе :focus-ring из спецификации CSS Selectors Level 4 : https://www.youtube.com/watch?v=ilj2P5-5CjI&feature=youtu.be

[49] Вы знаете, что такое трансдьюсеры: https://habrahabr.ru/post/325388/

[50] Справочник современных концепций JavaScript: часть 1: https://medium.com/devschacht/glossary-of-modern-javascript-concepts-1198b24e8f56

[51] Сборщик мусора в V8, иллюстрированное руководство: https://medium.com/devschacht/%D1%81%D0%B1%D0%BE%D1%80%D1%89%D0%B8%D0%BA-%D0%BC%D1%83%D1%81%D0%BE%D1%80%D0%B0-%D0%B2-v8-%D0%B8%D0%BB%D0%BB%D1%8E%D1%81%D1%82%D1%80%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%BD%D0%BE%D0%B5-%D1%80%D1%83%D0%BA%D0%BE%D0%B2%D0%BE%D0%B4%D1%81%D1%82%D0%B2%D0%BE-d3e496a4d378

[52] Создаем игровой движок с видом от первого лица за 265 строк кода на JavaScript: https://tproger.ru/translations/first-person-engine-265-lines/

[53] 77% сайтов используют хотя бы одну уязвимую JS библиотеку: https://snyk.io/blog/77-percent-of-sites-use-vulnerable-js-libraries/

[54] Улучшаем JavaScript с помощью Flow: https://www.sitepoint.com/writing-better-javascript-with-flow/

[55] Cyclow — реактивный фронтенд фреймворк для JavaScript: http://cyclow.js.org/

[56] 12 крайне полезных хака для JavaScript: https://hackernoon.com/12-extremely-useful-hacks-for-javascript-278567de2706

[57] Основы работы с DOM-ом на ванильном JavaScript (без jQuery): https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/

[58] Glimmer — UI компоненты для Ember: https://glimmerjs.com/

[59] Первый взгляд на ES2018: https://www.youtube.com/watch?v=s-G_RZ4RJLU

[60] ECMAScript Observable: https://medium.com/devschacht/ecmascript-observable-1f29d5c5e95c

[61] Использование генератовров в итераторах: https://ponyfoo.com/articles/iterators-as-generators

[62] Шесть причин, по которым Async/Await заменят промисы: https://hackernoon.com/6-reasons-why-javascripts-async-await-blows-promises-away-tutorial-c7ec10518dd9

[63] Как создать собственный React Router v4: https://medium.com/high-technologies-center/%D0%BA%D0%B0%D0%BA-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D1%82%D1%8C-%D1%81%D0%BE%D0%B1%D1%81%D1%82%D0%B2%D0%B5%D0%BD%D0%BD%D1%8B%D0%B9-react-router-v4-f542c58a16e9

[64] Простая разработка React в 2017-м: https://hackernoon.com/simple-react-development-in-2017-113bd563691f

[65] Да, React захватывает разработку фронтенда. И вот почему: https://medium.freecodecamp.com/yes-react-is-taking-over-front-end-development-the-question-is-why-40837af8ab76

[66] Reactide — первая выделенная IDE для разработки веб-приложений на React: http://reactide.io/

[67] React Bits — сборник шаблонов React, техник, советов и трюков: https://github.com/vasanthk/react-bits

[68] Берегись состояния Undefined в React: https://daveceddia.com/watch-out-for-undefined-state/

[69] Дружим Angular с Google (Angular Universal): https://habrahabr.ru/post/324926/

[70] Angular v4: Hybrid Upgrade Application: https://medium.com/@dormoshe/angular-v4-hybrid-upgrade-application-73d5afba1e01

[71] Angular 4 уже здесь? Вот некоторые его особенности: https://medium.com/@pixelcrayons/angular-4-0-0-70ae70cc7e5a

[72] Что нового в Angular 4?: https://blog.yipl.com.np/whats-up-with-angular-4-abfd2f7ce2d4

[73] Vue.js Tutorial: пример, как создать и пререндерить дружественный к SEO сайт: https://snipcart.com/blog/vuejs-tutorial-seo-example

[74] Создание игры Tic-Tac-Toe с помощью Vue 2: часть 1: https://scotch.io/tutorials/building-a-tic-tac-toe-game-with-vue-2-part-1

[75] Шпаргалка по VueJS 2.2: https://vuejs-tips.github.io/cheatsheet/

[76] Семь способов задать шаблон компонента во Vue.js: http://vuejsdevelopers.com/2017/03/24/vue-js-component-templates/

[77] Однонаправленный поток данных с Vuex: https://medium.com/@softwarecf/uni-directional-data-flow-with-vuex-4f31d7ac8c83

[78] polished: https://github.com/styled-components/polished

[79] Popper.js: https://popper.js.org/

[80] Choices.js: https://joshuajohnson.co.uk/Choices/

[81] Mozilla развивает средства верификации бинарных файлов Firefox: http://www.opennet.ru/opennews/art.shtml?num=46291

[82] Разработчики Chrome намерены ограничить всплывающие диалоги на JavaScript: http://www.opennet.ru/opennews/art.shtml?num=46282

[83] Выпуск web-браузера Vivaldi 1.8: http://www.opennet.ru/opennews/art.shtml?num=46274

[84] FF Developer Edition 54: новый инспектор и отладчик фич, помощь MDN в netmonitor и многое другое: https://hacks.mozilla.org/2017/03/developer-edition-54-new-inspector-and-debugger-features/

[85] Новые функции в Safari 10.1: https://webkit.org/blog/7477/new-web-features-in-safari-10-1/

[86] CodePlex закрывается: https://habrahabr.ru/post/325404/

[87] Илон Маск основал компанию Neuralink, которая займется подключением мозга к компьютеру: http://itc.ua/news/ilon-mask-osnoval-kompaniyu-neuralink-kotoraya-zaymetsya-podklyucheniem-mozga-k-kompyuteru/

[88] Google открыла портал для 2000 своих проектов Open Source: https://geektimes.ru/post/287476/

[89] Visual Studio Code отнимает 13% ресурсов CPU из-за мерцания курсора: https://geektimes.ru/post/287342/

[90] С Flash Player все плохо: логистическая компания FedEx готова «платить» по $5 клиентам за использование Adobe Flash Player: https://tproger.ru/news/fedex-flash-player-pay/

[91] Смерть SMS: операторы отключают услугу по всему миру: http://gagadget.com/26388-smert-sms-operatoryi-otklyuchayut-uslugu-po-vsemu-miru/

[92] Экс-сотрудник YouTube перешел в Apple. Он займется развитием видеоплатформы компании: https://ain.ua/2017/04/02/v-apple-pereshel-eks-sotrudnik-youtube

[93] Бесплатный Google Optimize приносит A/B-тестирование сайтов в массы: https://ain.ua/2017/03/25/besplatnyj-google-optimize-prinosit-ab-testirovanie-sajtov-v-massy

[94] Сложные ситуации в IT, и что с ними делать?: https://dou.ua/lenta/columns/difficult-situations-in-it/

[95] Вредные советы: зачем нужен неподдерживаемый код и как его писать: https://tproger.ru/translations/unmaintainable-code/

[96] Обмен значений переменных: разбор популярных способов решения известной задачи с IT-собеседований: https://tproger.ru/problems/popular-ways-to-swap/

[97] Как изменился RuTracker спустя год после «вечной блокировки»: https://apparat.cc/world/rutracked/

[98] Незаменимых нет: Что такое диффузия технологий и как она влияет на рабочие места: http://secretmag.ru/longread/2017/03/28/privychka-menyatsya-kak-tehnologii-ostavyat-nas-bez-raboty/

[99] Как не захлебнуться в информационной волне?: http://gosvopros.ru/job/qualification/tech/

[100] Пиратство — не порок?: http://www.computerra.ru/164877/ep/

[101] Первоапрельский IT-юмор: подборка шуток известных компаний: https://tproger.ru/devnull/1-april-2017/

[102] Как российские и иностранные бренды шутили на 1 апреля: https://vc.ru/p/april-fools-2017

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

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

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

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

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