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

---

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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] Javascript: #js

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

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

[7] #50 – Алексей Симоненко об истории создания HTML Academy и особенностях pitercss_conf: https://soundcloud.com/frontend-weekend/fw-50

[8] Новости 512 — Выпуск №3 (23.04 — 29.04): https://soundcloud.com/csssr/news512_03

[9] «Верстка на vue.js»: https://www.youtube.com/watch?v=yTtBw3BIntI

[10] Фронтенд как у сына маминой подруги: https://habr.com/company/yamoney/blog/354416/

[11] Генератор статических сайтов metalsmith: https://habr.com/company/tinkoff/blog/353022/

[12] Я создал PWA и опубликовал его в 3 магазина приложений. И вот что я узнал: http://debuggerdotbreak.judahgabriel.com/2018/04/13/i-built-a-pwa-and-published-it-in-3-app-stores-heres-what-i-learned/

[13] О глобальном атрибуте `hidden` в HTML5: https://www.impressivewebs.com/html5-global-hidden-attribute/

[14] Измеряем сайты с помощью Mobile-First инструментов оптимизации: https://www.smashingmagazine.com/2018/04/mobile-first-optimization-tools/

[15] GTmetrix Bookmarklet – начните тестирование прямо из вашей панели закладок: https://gtmetrix.com/blog/gtmetrix-bookmarklet-start-a-test-from-your-bookmarks-bar/

[16] Case study: анализ производительности сайта Walmart: https://iamakulov.com/notes/walmart/

[17] Perfume.js: http://zizzamia.github.io/perfume/

[18] Релиз Node.js 10 и NPM 6: https://habr.com/post/354234/

[19] Инструментарий Microsoft Edge DevTools представлен в виде Windows-приложения: https://tproger.ru/news/edge-devtools-release/

[20] Что нового в Node 10: https://levelup.gitconnected.com/whats-new-in-node-10-ad360ae55ee4

[21] 6 необходимы инструментов, которые сделают релиз, версионирование и поддержку ваших npm модулей: https://hackernoon.com/these-6-essential-tools-will-maintain-your-npm-modules-for-you-4cbbee88e0cb

[22] webpack 4 configurator: http://web.jakoblind.no/webpack-config/

[23] WCAG 2.1: что нас ожидает в новом руководстве по доступности: https://www.deque.com/blog/wcag-2-1-what-is-next-for-accessibility-guidelines/

[24] Более доступная разметка с помощью : https://hiddedevries.nl/en/blog/2018-04-21-more-accessible-markup-with-display-contents

[25] Заметка о работе над доступностью сайта reddit: https://www.reddit.com/r/redesign/comments/8f367j/an_accessibility_review_of_the_top_bar/

[26] HTML Email и Accessibility: https://css-tricks.com/html-email-accessibility/

[27] Инспектируем доступность писем в Firefox: https://www.rodriguezcommaj.com/blog/inspecting-email-accessibility-in-firefox

[28] О том, как правильно создавать мемы с учетом доступности: http://adrianroselli.com/2018/04/accessible-memes-can-be-done.html

[29] Infinite Scroll & Accessibility! Это вообще нормально?: https://www.digitala11y.com/infinite-scroll-accessibility-is-it-any-good/

[30] Креативный эффект для кнопок, позволяющих разложить их на мелкие частицы: https://tympanus.net/codrops/2018/04/25/particle-effects-for-buttons/

[31] Анимация для перехода по страниц, которая ощущается нативной: https://css-tricks.com/native-like-animations-for-page-transitions-on-the-web/

[32] Интерактивный Mario Kart на «чистом» CSS: https://codeburst.io/mario-kart-css-7572bd2ce608/

[33] Зачем нужны кастомные свойства?: https://medium.com/@juwain/why-custom-properties-b849b88c19cc

[34] Оптимизация стилей от разработчиков Linkedin: опенсорсные проекты CSS Blocks для компонентов стилей и OptiCSS для их оптимизации: https://engineering.linkedin.com/blog/2018/04/css-at-scale--linkedins-new-open-source-projects-take-on-stylesh

[35] GridtoFlex: http://www.gridtoflex.com/

[36] 7 трюков для улучшения производительности CSS: https://www.keycdn.com/blog/css-performance/

[37] Стилизация и анимация элемента Progress: https://snook.ca/archives/html_and_css/animating-progress

[38] Рецепты радиальных градиентов: https://css-tricks.com/radial-gradient-recipes/

[39] 3 способа, с которыми CSSinJS убирает мусор из вашего процесса веб-разработки: http://seifi.org/cssinjs/3-ways-cssinjs-eliminates-waste-from-our-web-development-workflow.html

[40] Заметка о производительной анимации и о скрытых проблемах will-change: https://dassur.ma/things/forcing-layers/

[41] Почему мы решили отказаться от LESS в пользу SCSS: https://www.jotform.com/blog/408-Why-we-decided-to-drop-LESS-for-SCSS

[42] Как работает JS: анимация средствами CSS и JavaScript: https://habr.com/company/ruvds/blog/354438/

[43] Хочешь изучить ES6+? Попробуй этот бесплатный курс из 23 частей и стань JavaScript ниндзя: https://medium.freecodecamp.org/want-to-learn-es6-take-this-free-23-part-course-and-become-a-javascript-ninja-55002db1ff74

[44] Расширения VS Code, облегчающие написание кода JS разработчикам и делающие их счастливее: https://hackernoon.com/vs-code-extensions-for-happier-javascript-coding-e258f72dd9c1

[45] Краткая история JavaScript, видео от Brendan Eich (создателя JavaScript): https://www.youtube.com/watch?v=qKJP93dWn40&feature=youtu.be

[46] Демистификация ‘new’ в JavaScript: https://medium.freecodecamp.org/demystifying-javascripts-new-keyword-874df126184c

[47] Вопросы для собеседования по Vue.js: https://www.onlineinterviewquestions.com/vue-js-interview-questions/

[48] VuePress vs Nuxt.js: https://medium.com/vue-mastery/vuepress-vs-nuxt-js-ffc46cc38756

[49] Создание отзывчивых Vue компонентов с помощью ResizeObserver: https://itnext.io/making-adaptive-vue-components-with-resizeobserver-123b5ebb20ae

[50] Приложение на Vue.js с использованием Axios с Vuex: https://www.thepolyglotdeveloper.com/2018/04/vuejs-app-using-axios-vuex/

[51] Стратегии тестирования для React и Redux: https://hacks.mozilla.org/2018/04/testing-strategies-for-react-and-redux/

[52] 5 лучших архитектурных практик React: https://www.sitepoint.com/react-architecture-best-practices/

[53] Ускорение Angular-приложений: https://habr.com/company/jugru/blog/354552/

[54] Часть 1: компонентная архитектура: https://auth0.com/blog/new-features-for-developing-angularjs-applications-part-1/

[55] Часть 2: создание приложения: https://auth0.com/blog/developing-angularjs-apps-part-2/

[56] Запускаем AngularJS 1.6 в Angular 5 (бок о бок): https://medium.com/sv-blog/running-angularjs-1-6-in-angular-5-side-by-side-d2ed771e2a8f

[57] tui.calendar: https://github.com/nhnent/tui.calendar

[58] DayJs: https://github.com/xx45/dayjs

[59] Dinero.js: https://sarahdayan.github.io/dinero.js/

[60] Можно ли доверять свои пароли синхронизации Chrome и Firefox?: https://habr.com/post/354558/

[61] В Firefox 60 появится защита от CSRF-атак: https://www.opennet.ru/opennews/art.shtml?num=48496

[62] Мгновенный поиск и синхронизация по QR-коду: браузер Opera получил обновление: https://tproger.ru/news/opera-desktop-new/

[63] Новая версия браузера Google Chrome Canary демонстрирует грядущее обновление дизайна в стиле Material Design 2: https://itc.ua/news/novaya-versiya-brauzera-google-chrome-canary-demonstriruet-gryadushhee-obnovlenie-dizayna-v-stile-material-design-2/

[64] Улучшения в Inspector Styles Sidebar: https://webkit.org/blog/8239/web-inspector-styles-sidebar-improvements/

[65] Использование Chrome как локального веб сервера: https://medium.com/@jmatix/using-chrome-as-a-local-web-server-af04baffd581

[66] habrahabr.ru → habr.com: https://habr.com/company/tm/blog/93946/

[67] Google выпустила отдельное мобильное приложение для ведения задач Google Tasks: https://vc.ru/37066-google-vypustila-otdelnoe-mobilnoe-prilozhenie-dlya-vedeniya-zadach-google-tasks

[68] Представлена утилита DeepCode для нахождения и исправления ошибок в коде: https://tproger.ru/news/deepcode-fix-code/

[69] Mozilla открыла доступ к Hubs: социальная сеть в виртуальной реальности: https://tproger.ru/news/mozilla-hubs/

[70] Графический редактор GIMP обновился впервые за 6 лет: https://tproger.ru/news/gimp-release/

[71] Особенности соответствия требованиям GDPR для WordPress пользователей: http://oddstyle.ru/wordpress-2/stati-wordpress/osobennosti-sootvetstviya-trebovaniyam-gdpr-dlya-wordpress-polzovatelej.html

[72] Дайджест за прошлую неделю: https://habr.com/company/zfort/blog/354060/

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

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

[75] Источник: https://habr.com/post/354672/?utm_campaign=354672

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