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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №240 (5 — 11 декабря 2016)

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №240 (5 — 11 декабря 2016) - 1

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

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

Медиа

Дайджест свежих материалов из мира фронтенда за последнюю неделю №240 (5 — 11 декабря 2016) - 32 CSS

Дайджест свежих материалов из мира фронтенда за последнюю неделю №240 (5 — 11 декабря 2016) - 48 JavaScript

habr Браузеры

Дайджест свежих материалов из мира фронтенда за последнюю неделю №240 (5 — 11 декабря 2016) - 91 Занимательное

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

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

Автор: Zfort Group

Источник [118]


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

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

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

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

[2] CSS: #css

[3] Javascript: #js

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

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

[6] Основные принципы разметки в HTML 5.1: https://bitsofco.de/document-outlines-in-html-5-1/

[7] Маскирование изображений с помощью SVG: https://www.jayfreestone.com/journal/masking-bitmaps-with-svg/

[8] Самый простой и производительный способ подключать ссылки для социальных медиа: https://css-tricks.com/simple-social-sharing-links/

[9] Нам нужно поговорить о техническом долге: https://24ways.org/2016/we-need-to-talk-about-technical-debt/

[10] Девять ресурсов, на которых можно учиться кодить по 15 минут в день: https://medium.com/the-mission/9-places-to-learn-how-to-code-in-15-minutes-or-less-a-day-b29451500c21

[11] Языки, фреймворки и инструменты, которые вы «должны» изучить в 2017-м: http://tutorialzine.com/2016/12/the-languages-frameworks-tools-you-should-learn-in-2017/

[12] Топ JS фреймворков и тем для изучения в 2017-м: https://medium.com/javascript-scene/top-javascript-frameworks-topics-to-learn-in-2017-700a397b711

[13] 5 «лучших» Javascript фреймворков для изучения в 2017-м: https://www.dunebook.com/5-best-javascript-frameworks-to-learn-in-2017/

[14] Размышления о будущем веба: https://www.vectorform.com/news-and-views/access-and-experience-the-future-web/

[15] Про оптимизацию рендеринга — с оптимизмом: https://habrahabr.ru/company/livetyping/blog/316136/

[16] Мгновенные статические веб-страницы с помощью Service Worker: http://calendar.perfplanet.com/2016/instant-static-web-pages-with-service-worker/

[17] Анимация 60fps в вебе: https://westwingsolutions.com/articles/blog/60fps-animations

[18] Сохраняем интернету 2000 терабайт в день благодаря оптимизации Font Awesome: https://pixelambacht.nl/2016/font-awesome-fixed/

[19] Accessibility: https://developer.mozilla.org/en-US/docs/Learn/Accessibility

[20] WAI-ARIA: https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics

[21] HTML: https://developer.mozilla.org/en-US/docs/Learn/Accessibility/HTML

[22] CSS: https://developer.mozilla.org/en-US/docs/Learn/Accessibility/CSS_and_JavaScript

[23] мультимедиа: https://developer.mozilla.org/en-US/docs/Learn/Accessibility/Multimedia

[24] мобильная доступность: https://developer.mozilla.org/en-US/docs/Learn/Accessibility/Mobile

[25] Доступность в вебе — разработка веба с эмпатией: https://medium.com/@paramsingh_66174/web-accessibility-developing-web-with-empathy-2aee08ebe97c

[26] Опасайтесь вложенности ролей: http://adrianroselli.com/2016/12/be-wary-of-nesting-roles.html

[27] Progressive Web AMPs: https://www.smashingmagazine.com/2016/12/progressive-web-amps/

[28] Урок, который я получил, работая с AMP от Google: https://www.viget.com/articles/lessons-learned-working-with-googles-amp

[29] CloudFour делится опытом перевода сайта в PWA: https://cloudfour.com/thinks/hey-hey-cloud-four-is-a-pwa/

[30] Создание Web Bluetooth Progressive Web App: https://medium.com/@nimbleape/building-a-web-bluetooth-progressive-web-app-a859f91fd29

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

[32] Подкаст radiojs, Выпуск 43: Фиолетовый паттерн: https://radiojs.ru/2016/12/radiojs-43/

[33] Я.Субботник по фронтенду: https://events.yandex.ru/events/yasubbotnik/10-dec-2016/

[34] KharkivJS #7 2016 : https://www.youtube.com/playlist?list=PLnkLrCUX4Qh435vUFpNTUSJILQK27_akH

[35] Chrome DevTools: Optimise your Web Development Workflow 2016: https://umaar.com/dev-tips/125-optimise-web-dev-workflow/

[36] CSSConf.Asia 2016 : https://www.youtube.com/playlist?list=PL37ZVnwpeshFizH1JsG3s7_qyN2Uk0OSh

[37] JSConf.Asia 2016 : https://www.youtube.com/playlist?list=PL37ZVnwpeshFn7VjMHjenn8niUTYNe8O7

[38] ffconf 2016: https://www.youtube.com/watch?v=uXYZbLT0j9c&feature=youtu.be&list=PLXmT1r4krsTpDoGcdh1baZPIV6DtX9_rX

[39] ReactiveConf 2016 : https://www.youtube.com/playlist?list=PLa2ZZ09WYepMCRRGCRPhTYuTCat4TiDlX

[40] Анимации на GPU: делаем это правильно: https://habrahabr.ru/company/odnoklassniki/blog/313978/

[41] Битва css-in-js: https://engineering.hellofresh.com/the-css-in-js-battle-89c34a7a83ea#.2ev3n29f0

[42] Директива CSS @support и ее двойник в JS. Готовы к использованию!: https://medium.com/@barvysta/css-support-directive-and-its-js-twin-ready-to-use-6eea2fefef36

[43] support: https://habrahabr.ru/users/support/

[44] CSS Grid!: http://meyerweb.com/eric/thoughts/2016/12/05/css-grid/

[45] Virtual CSS c помощью Styletron: https://ryantsao.com/blog/virtual-css-with-styletron

[46] BEM и поддерживаемый CSS: https://www.stackbuilders.com/news/bem-and-maintainable-css

[47] Мощь селекторов CSS и как их использовать: http://webdesignerwall.com/tutorials/the-power-of-css-selectors-and-how-to-use-them

[48] Балансировка текста в отзывчивом дизайне: https://24ways.org/2016/responsive-display-text/

[49] Гибкая типографика с помощью :root: http://allthingssmitty.com/2016/12/05/flexible-type-using-root/

[50] Сокращенный синтаксис CSS рассматривается как антипаттерн: http://csswizardry.com/2016/12/css-shorthand-syntax-considered-an-anti-pattern/

[51] Изучение linear-gradient() с помощью разработки сложного шахматного узора: http://www.zpyro.com/learn-linear-gradient-by-designing-a-complex-chess-pattern/

[52] Новый мир: написание CSS в ClojureScript и жизнь после Sass: https://blog.estimate-work.com/a-new-world-writing-css-in-clojurescript-and-life-after-sass-bdf5bc80a24f

[53] Использование CSS переменных в разработке сайтов: http://thenewcode.com/1161/Using-CSS-Variables-in-Site-Development

[54] Циклы в CSS препроцессорах: https://css-tricks.com/loops-css-preprocessors/

[55] CSS object-fit для добавления мощности вашей верстке: https://medium.com/@barvysta/css-object-fit-to-power-up-your-markup-1c9be305e5a0

[56] Нейронные сети на JS. Создавая сеть с нуля: https://habrahabr.ru/company/epam_systems/blog/317050/

[57] Дорогой JavaScript: https://habrahabr.ru/post/316978/

[58] React, Web Components, Angular и jQuery — друзья навеки. Универсальные JavaScript-компоненты: https://habrahabr.ru/company/devexpress/blog/316358/

[59] Челендж JavaScript30: https://ymatuhin.ru/front-end/javascript-30/

[60] Распутываем спагетти-код: как писать поддерживаемый Javascript: http://prgssr.ru/development/rasputyvaem-spagetti-kod-kak-pisat-podderzhivaemyj-javascript.html

[61] Забавные хаки для ускорения контента: https://jakearchibald.com/2016/fun-hacks-faster-content/

[62] Нативная разработка JavaScript после Internet Explorer: https://www.sitepoint.com/native-javascript-development-after-internet-explorer/

[63] Отображаем динамические сообщения с помощью Web Notification API: https://www.sitepoint.com/browser-notification-api/

[64] Как должны работать табы: https://remysharp.com/2016/12/11/how-tabs-should-work

[65] Примеры JavaScript кода, актуального для 2016-го года по версии автора: https://blog.hellojs.org/enough-javascript-to-be-dangerous-in-2016-5d04b3439e16

[66] Урок по созданию Scrollspy-навигации на JS: https://scotch.io/tutorials/build-a-custom-javascript-scrollspy-navigation

[67] styletron — универсальные высокопроизводительные стили css-in-js: https://github.com/rtsao/styletron

[68] Релиз V8 версии 5.6: http://v8project.blogspot.com/2016/12/v8-release-56.html

[69] Angular 1.6 уже здесь, и вот что вы должны по этому поводу знать: https://toddmotto.com/angular-1-6-is-here

[70] Релиз Angular 2.3.0: http://angularjs.blogspot.com/2016/12/angular-230-now-available.html

[71] Текущее состояние Babel и его планы на будущее: https://babeljs.io/blog/2016/12/07/the-state-of-babel

[72] Анонс TypeScript 2.1: https://blogs.msdn.microsoft.com/typescript/2016/12/07/announcing-typescript-2-1/

[73] TypeScript 2.1: async/await для ES3/ES5: https://blog.mariusschulz.com/2016/12/09/typescript-2-1-async-await-for-es3-es5

[74] Async/Await заработали в Firefox: https://hacks.mozilla.org/2016/12/asyncawait-arrive-in-firefox/

[75] Путеводитель по JavaScript Promise для новичков: https://habrahabr.ru/company/zerotech/blog/317256/

[76] Неизменяемый JavaScript: как это делается с ES6 и выше: https://habrahabr.ru/company/piter/blog/317248/

[77] Что и как в ES6: хитрости, лучшие практики и примеры. Часть вторая. Мэпы, слабые мэпы, обещания, генераторы, async / await, геттеры / сеттеры, символы: https://tproger.ru/translations/es6-cheatsheet-2/

[78] Основы Flow за 10 минут: https://www.youtube.com/watch?v=xWMuAUbXcdQ

[79] Проверка типов в JavaScript: Начало работы с Flow.: https://hackernoon.com/type-checking-in-javascript-getting-started-with-flow-8532c11aceb3

[80] Часть I: https://medium.freecodecamp.com/why-use-static-types-in-javascript-part-1-8382da1e0adb

[81] II & III: https://medium.com/@preethikasireddy/why-use-static-types-in-javascript-part-2-part-3-be699ee7be60#.cxkprazjf

[82] Возможно вам не понадобится TypeScript (или статические типы): https://medium.com/javascript-scene/you-might-not-need-typescript-or-static-types-aa7cb670a77b

[83] Основы производительности React-приложений: http://blog.csssr.ru/2016/12/07/react-perfomance/

[84] Можно ли обойтись без jsx и зачем?: https://habrahabr.ru/post/317114/

[85] Переведена документация Vue.JS 2.x: https://habrahabr.ru/post/317112/

[86] 5 бесплатных туториалов по VueJS: https://hackernoon.com/5-free-vuejs-tutorials-3caa8ff865e9

[87] Laravel выбрал Vue, но вы не должны: https://medium.com/@MentallyFriendly/laravel-chooses-vue-but-you-dont-have-to-a578244648ce

[88] Если вы перешли с React на Vue, почему вы это сделали?: https://www.reddit.com/r/javascript/comments/5fi07s/have_you_moved_from_react_to_vue_if_so_why/

[89] React на серверной стороне: https://remysharp.com/2016/12/07/server-side-react

[90] Начало квеста по написанию кода: Как написать свой первый React компонент: https://www.youtube.com/watch?v=xRoYf-QgHpc

[91] Ошибочное сравнение React и Angular: https://medium.com/aya-experience/wrong-comparisons-between-react-and-angular-707d504c95df

[92] Почему мы выбрали Angular 2 вместо React для нашей ентрейпрайз разработки: https://blog.biznas.io/why-we-chose-angular-2-over-react-for-our-enterprise-software-development-work-392e2c9e39a9

[93] pulltorefresh.js: https://www.boxfactura.com/pulltorefresh.js/

[94] myScale: https://webkul.github.io/myscale/

[95] Siema: https://pawelgrzybek.com/siema/

[96] es-beautifier: https://www.npmjs.com/package/es-beautifier

[97] Инструмент разработки Firebug закрывается: «Пользуйтесь Firefox DevTools»: https://habrahabr.ru/post/316974/

[98] Новая версия браузера Chrome 55 использует примерно на 30% меньше оперативной памяти, нежели предыдущая Chrome 54: http://itc.ua/news/novaya-versiya-brauzera-chrome-55-ispolzuet-primerno-na-30-menshe-operativnoy-pamyati-nezheli-predyidushhaya-chrome-54/

[99] Chrome 56 Beta: “Not Secure” warning, Web Bluetooth и CSS position: sticky: https://blog.chromium.org/2016/12/chrome-56-beta-not-secure-warning-web.html

[100] Google Chrome полностью прекращает поддержку Adobe Flash Player: https://tproger.ru/news/no-more-flash-player-in-google-chrome/

[101] Google добавила в Chrome для Android возможность скачивать музыку и видео: https://vc.ru/n/new-chrome-android

[102] Детали свежего обновления Microsoft Edge: https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/14986/

[103] Release Notes for Safari Technology Preview 19: https://webkit.org/blog/7093/release-notes-for-safari-technology-preview-19/

[104] Свершилось! Полноценная Windows 10 приходит на ARM: http://gagadget.com/announce/24870-svershilos-polnotsennaya-windows-10-prihodit-na-arm/

[105] YouTube выплатил $1 млрд авторских отчислений музыкантам и лейблам за последние 12 месяцев: https://vc.ru/n/youtube-music

[106] Куда пойти учиться программисту: советы опытного тимлида, преподавателя и новичка: https://vc.ru/p/csssr-programming

[107] Мифы, в которые верят программисты: https://tproger.ru/articles/falsehoods-programmers-believe-in/

[108] «Уберите всё со стола» — рассказ разработчика о дистанционном собеседовании в Amazon: https://tproger.ru/translations/amazon-interview-bs/

[109] О техподдержке Google или робот с человеческой душой: http://www.computerra.ru/160147/o-tekhpodderzhke-google-ili-robot-s-cheloveches/

[110] Depositphotos назвал 12 главных трендов видео и фото на 2017 год: http://ain.ua/12-fototrendov-na-2017-god

[111] Magic Leap — афера на $1.4 миллиарда?: https://shazoo.ru/2016/12/10/46873/magic-leap-afera-na-14-milliarda

[112] Самые яркие технологические тренды на Web Summit 2016: как изменится мир в ближайшем будущем: http://www.cossa.ru/152/147544/

[113] В Google Play Movies теперь доступны 4K-фильмы: http://gagadget.com/announce/24855-v-google-play-movies-teper-dostupnyi-4k-filmyi/

[114] 4 эксперимента с рукописным текстом с помощью нейронной сети: http://distill.pub/2016/handwriting/

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

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

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

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