Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Веб-разработка |
CSS |
Javascript |
Браузеры |
Новости и зЗанимательное |
Веб-разработка
- Подкаст Веб-стандарты, Выпуск №40: Chromium 54, Safari TP16, Mozilla, Servo и разработка движков, таблицы, Node.js 7, стандарты и полифилы, border-image, Дейв Шей про режимы смешивания.
- Видео докладов с конференции FrontTalks, прошедшей 17 и 18 сентября в Екатеринбурге
- Accelerated Mobile Pages. Юрий Матюхин делится своим опытом
- SVG и медиа-запросы
- Chrome, Firefox и Edge перешли на новый этап тестирования технологии WebAssembly
Пока растр, привет вектор: три способа простого использования SVG
(Bye raster, hello vector: 3 ways to use SVG easier)Викторина: насколько хорошо вы знаете парсер HTML (HTML parser quiz)
Bootsrap 4: что нового и что изменилось в Bootstrap 4, а также шпаргалка с именами классов
Представление FlyWeb — набор новых API от Mozilla для создания локальных веб-серверов и сервисов (Introducing FlyWeb)
Соединяем виртуальные миры: гиперссылки в WebVR
(Connecting Virtual Worlds: Hyperlinks in WebVR)Ссылки mailto: пусть пользователь выбирает сам
(Mailto links: Letting the user decide)Веб — это не модно, или как я научился любить веб
(The Web is not Fashionable. or: How I Learned to Love the Web)Исследование вьюпортов, часть очередная
(Viewports research, part umpteen)Какой язык программирования вам следует учить первым?
(What programming language should you learn first? ʇdıɹɔsɐʌɐɾ :ɹǝʍsuɐ)- Производительность:
10 принципов для плавной анимации в вебе (10 principles for smooth web animations)
Перестаньте объединять ваш CSS/JS (Stop Concatenating Your CSS/JS)
Производительность веба (Web Runtime Performance)
- Доступность:
- Доступность сайтов для самых маленьких
Инструменты для разработки доступных сайтов (Tools for Developing Accessible Websites)
10 вещей, которых не хватает на вашем сайте (10 things your website might be missing)
Почему семантика имеет значение (Why do semantics matter?)
- Инструменты:
Опросник по Front-End инструментам – 2016 (Front-End Tooling Survey – 2016)
Более быстрые и надёжнее CI билды с Yarn (Faster, More Reliable CI Builds with Yarn)
RFC: бюджет производительности Webpack (RFC: Webpack Performance Budgets)
webpack-bundle-analyzer — визуализатор содержимого бандла (webpack-bundle-analyzer — Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap)
Эффектные медиа-попапы (Artsy Media Pop Up Effect)
Создаем прогресс-бар с радиальным заполнением (Making a Doughnut Progress Bar )
CSS
Анонсируем Dart Sass
Веб-шрифты, ребята, ну я даже не знаю (Web fonts, boy, I don't know)
Как и почему вы должны инлайнить критический CSS
(How and Why You Should Inline Your Critical CSS)Вещи, которые я узнал о CSS Grid Layout (Things I’ve Learned About CSS Grid Layout)
[ИТ-лекторий]: Стандарт СSS: как и для чего он был придуман?
CSS Motion Path по состоянию на октярь 2016
Блог webkit: Изменчивые шрифты в вебе (Variable Fonts on the Web)
Современный сброс CSS (с оговорками) (A modern CSS reset (with caveats))
8 простых правил для надежной, масштабируемой архитектуры CSS
(8 simple rules for a robust, scalable CSS architecture)Архитектура фронтенда, часть 2: брендовые переменные
(Front-end Architecture: Part 2 — Brand Variables)Как построить отзывчиваю сеточную систему (How to build a responsive grid system)
О семантических именах классов (Semantic class names: are you being too generic?)
Пост-процессоры CSS для начинающих: советы и ресурсы
(CSS Post-Processors For Beginners: Tips and Resources)Континуум Q: использование единиц измерения q в CSS
(The Q Continuum: Using q Measurements In CSS)Опрос: должен ли CSS стать более похожим на язык программирования?
(Poll: should CSS become more like a programming language?)Почему HTML думает, что “chucknorris” это цвет? (Why does HTML think “chucknorris” is a color?)
glamor — внедрённый css в React приложениях (glamor — inline css for react et al)
JavaScript
JavaScript и SEO в 2016 году
$mol: reactive micromodular ui-framework
Детали о версии Node.js v7
(Node.js v7 – URLs, deprecation warnings and a better developer experience)Совместное планирование с requestIdleCallback
(Cooperative Scheduling with requestIdleCallback)- Теория:
Паттерн Стратегия на JavaScript
Ванильный JavaScript vs Фреймворки и Библиотеки — в поисках хорошего баланса (Vanilla JavaScript vs. Frameworks & Libraries — Finding a good balance)
Учебный план для излечения усталости от JavaScript
(A Study Plan To Cure JavaScript Fatigue)Является ли JavaScript всегда лучшем решением?
(Editorial: Is JavaScript Always the Best Solution?)Войны JavaScript. Как мы до этого дошли? (The JavaScript Wars. How did we get here?)
Замыкания в JavaScript на примерах (Closure in JavaScript through examples)
Делаем ваш JavaScript более функциональным (Making Your JavaScript More Functional)
- Практика:
Создание шейдеров с помощью Babylon.js (Building Shaders With Babylon.js)
Начало работы с MobX: простой пример
(Getting Started With MobX: An Easy Example)Создание динамических таблиц за секунды из любых JSON данных
(Make Dynamic Tables in Seconds from Any JSON Data)Программная генерация звуков с Javascript
(Generate Sounds Programmatically With Javascript)
- React:
- 9 полезных советов для тех, кто начинает знакомство с React.js
Виджет автозаполнения с React (Autocomplete Widget with React)
Нужна ли вообще библиотека для роутинга? (Do I Even Need A Routing Library?)
- Angular:
Angular 2 — уходим от распознавания изменений
(Angular 2 — Escape From Change Detection)Будущее Angular 1.x, что дальше? (The future for Angular 1.x, what next?)
Простая авторизация с Angular с JSON веб токенами
(Easy Angular Authentication with JSON Web Tokens)Angular 2 — как использовать преимущества свойства exportAs
(Angular 2 — Take Advantage Of The exportAs Property)Тестирование Angular 2 в деталях: сервисы (Angular 2 Testing In Depth: Services)
- ES6:
Промисы в Javascript: зачем и как (Javascript Promises; the Why and the How)
Шесть маленьких, но клевых свойств ES6 (Six Tiny But Awesome ES6 Features)
Введение в ES6: Переменные, стрелочные функции (Getting to Grips with ES6: )
Используйте лучшее из ES6 везде (Use the coolest ES6 features everywhere)
Вычисляемые tag функции для литералов шаблонов ES6
(Computing tag functions for ES6 template literals)
- Vue:
Замените jQuery на Vue.js в следующем вашем проекте на Bootstrap
(Drop jQuery from your Bootstrap project and replace it with Vue.js)VueJS: перебор элементов списка (VueJS: Loop List Elements)
VueJS: условное скрытие/отображение (VueJS: Conditional Show And Hide)
- Плагины:
utransition, микробиблиотека, упрощающая создание анимаций и управление ими в JS
typeis.js — простой и интеллектуальный детектор типов данных
Lightflow — библиотека для управления потоком по типу промисов для браузера и Node.js
SkateJS — библиотека для написания функциональных, лёгких и кросс-фреймворк совместимых веб компонентов по спецификациям W3C
egjs — библиотека с набором интерактивных UI компонентов
Recordy — запись с микрофона и добавление эффекта прямо в браузере
Браузеры
Из Firefox 52 удалят API уровня заряда аккумулятора для сохранения приватности пользовательских данных
- Chrome для Windows стал на 5%-15% быстрее за счет новых оптимизаций
- Microsoft пытается увеличить долю Microsoft Edge c помощью бонусов
- Microsoft Edge обошёл Chrome и Firefox в тесте безопасности
- Internet Explorer и Edge потеряли 40 млн. пользователей
Новое представление элемента input type=«date» в Firefox
Firefox Nightly News — поддержка async/await (Firefox Nightly News — async/await support in Firefox)
Новости и занимательное
Интернет-пользователей, заходящих с настольных компьютеров, стало меньше, чем мобильныхновость
Pornhub обходит блокировщики рекламы с помощью вебсокетов
- Microsoft запустила сервис для коллективной работы Teams, являющийся частью Office 365
- Викторина: хорошо ли вы знаете Stack Overflow?
- Статистика западных соцсетей: месячная аудитория, доход с пользователя, присутствие брендов
- Влияет ли доменная зона на поисковую выдачу
- Умные лампочки назвали угрозой эпидемии в интернете вещей
- Азбука ИИ: «Рекуррентные нейросети»
- Мобильные гаджеты обогнали ПК по заходам в интернет
- Android стал самой продаваемой мобильной системой в истории
- Duo Security: 65% пользователей до сих пор предпочитают Windows 7
- Почему пионер Linux Линус Торвальдс предпочитает x86, а не ARM
- Как быстро хакеры взломают тостер с выходом в интернет?
«Dear Microsoft», — письмо от Slack
Почему Slack может пожалеть из-за своего письма Microsoft
(Why Slack may live to regret its smarmy letter to Microsoft)Новый MacBook Pro — уже не Laptop для разработчиков часть 1 и 2
(New MacBook Pro is not a Laptop for Developers Anymore)
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group