Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №172 (9 — 16 августа 2015)

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

Веб-разработка

• Практические советы по повышению производительности HTML и JavaScript
• Оптимизируем графику с помощью WebP
• Как пасхалки в email помогли компании привлечь внимание к своей конференции (перевод)
• Глубокое погружение в Canvas
• Работаем с производительностью сайтов
• Заметки о собеседованиях для веб-разработчиков от Артёма Сапегина
• «Матрешкой по вебу». Интервью с разработчиком фреймворка Matreshka.js
• Отрисовка изображения за счет скроллинга страницы (Scroll Drawing)
• Плагины под Sublime Text для JS разработчиков (Sublime Text Plugins For JavaScript Developers)
• Отзывчивого дизайна не достаточно, мы нуждаемся в отзывчивой производительности (Responsive Design Is Not Enough, We Need Responsive Performance)
• Getting the “abc” right. Веб-разработчик подробно разбирает код сайта Alphabet
• Создание эффекта заполнения текста водой (Create Text Filling with Water Effect)
• Performance update #2: Electric Boogaloo. Анализ результатов по оптимизации производительности сайтов
• Окончательная подборка курируемых подборок на GitHub (The definitive list of lists (of lists) curated on GitHub)
• GitHub запускает новое приложение для настольных компьютеров (GitHub launches a new desktop application)
• Желающим научиться писать код (So You Want to Learn How to Code)
• Оранжевый — новый синий: Как портировать Chrome Extension в Firefox Extension. Доклад с 4front meetup #8
• 12 видео с Responsive day Out
• Видео с конференции You Gotta Love Frontend, прошедшей в Тель-Авиве

CSS

• Шлифуем CSS-анимацию
• BEMIT: Следующий шаг в развитии BEM по версии Гарри Робертса
• Глюки при отрисовке border-radius в Windows 10
• Пора всем узнать о PostCSS. Что это на самом деле? И для чего оно?
• Кроссбраузерность HTML страниц: зачем нужны reset.css и normalize.css
• Простой способ сделать отзывчивые изображения с помощью фоновых картинок в CSS
• Распределение задач между CSS и JavaScript
• Подробно о том, что такое критический CSS (Understanding Critical CSS)
• Использование Gulp для автоматизации критического пути в CSS (Use Gulp to automate your critical path CSS)
• Ускорьте ваш рабочий процесс с помощью LibSass и Autoprefixer (Speed up your workflow with LibSass and Autoprefixer)
• Deconfusing Pre- and Post-processing
• Proposing CSS input modality
• Разработчики WebKit представляют Backdrop Filters
• Восемнадцать ресурсов по изучению Flexbox (18 Excellent Resources for Learning Flexbox)
• Angular Fx — набор эффектов и анимаций для Angular (Angular CSS3 animations and effects for your elements.)
• Использование вывода сообщений об ошибках с помощью error в Sass (Using error responsibly in Sass)

JavaScript

• Универсальный JavaScript
• Javascript и часовые пояса — правильное время на сайте
• Изоморфное Приложение с React и Redux
• Object.defineProperty vs Object.observe
• Долговечность (или ее отсутствие) в JS фреймворках (Longevity (or Lack Thereof) in JavaScript Frameworks)
• ES6:
  
  • Введение в JavaScript ES6 классы (An Introduction To JavaScript ES6 Classes)
  • Достаточно ли хорош Babel для серьезного использования, чтобы начать писать на ES6?? (Is Babel good enough for serious use so that I can write in ES6?)
  • ES6 в деталях: Модули (ES6 In Depth: Modules)
  • Загадка ES6 (The ES6 Conundrum)

• Фреймворки
  
  • Relay — новый фреймворк от Facebook для создания data-driven приложений на React
  • Belle — настраиваемые React компоненты с отличным UX
  • Вышел релиз Ember.js 2.0, а io.js/node.js скоро зарелизятся под версией 1.0 (4.0 is the new 1.0)
  • Создайте Ваше первое приложение на Ember 2.0: от аутентификации до вызова API (Create your first Ember 2.0 app: From authentication to calling an API)
  • Советы и подсказки по отладке незнакомого AngularJS кода (Tips & Tricks for debugging unfamiliar AngularJS code)
  • Angular 2 Template Syntax Demystified — Part 1
  • AngularJS 2 — A Glance Into the Future — доклад Gion Kunz с SwissJS 2015

• О том, как Netflix.com ускоряли (Universal JavaScript, Drops Java From Rendering Pipeline) (Making Netflix.com Faster )
• Работа с JavaScript AST
• Почему я пишу простые JS модули (Why I Write Plain JavaScript Modules)
• JS жаргон: 10 терминов, которые вы должны знать (JavaScript Jargon: 10 Terms You Should Know)
• Состояние клиентских ошибок в JS (The State of Client-Side JavaScript Errors)
• A Javascript State of the Union
• Основные инструменты и библиотеки для современных JavaScript разработчиков (Essential Tools & Libraries for Modern JavaScript Developers)
• Советы и подсказки по отладке JavaScript (JavaScript Debugging Tips and Tricks)
• .bind() для «чайников» (.bind() For Dummies)
• Пишем JavaScript лучше с Flow (Writing better JavaScript with Flow)
• Плагины и библиотеки:
  
  • jQuery Video Extend — расширение возможностей HTML5 видео плеера
  • immu — маленькая библиотека для создания структур с неизменяемыми данными
  • Как уменьшить время загрузки с basket.js (How to Improve Loading Time with basket.js)
  • Peaks.js: отрисовка звуковых волн в браузере (Peaks.js: Audio waveform rendering in the browser)
  • canvid — библиотека для проигрывания коротких видео в HTML5 canvas
  • touchpoint-js — библиотека для визуализации кликов и тач-событий
  • frameSync — кросс-браузерное решение для кросс-документной onLoad синхронизации между сайтами/iframe-ами

Браузеры

• В Firefox отключат возможность устанавливать расширения без подписи
• Релиз Firefox 40
• Рынок браузеров с 2008 по 2015 год
• Разработчик браузера Opera намерен продать компанию
• Тортик для команды Edge от команды Chrome
• Планируемые улучшения движка V8 (Ignition: V8 Interpreter)

Дизайн

• Ссылка: посмотрите обновляемый список удачных сочетаний цветов
• Дизайн UI: ограничения человеческой памяти
• Дизайнер предложил концепт динамических иконок в iOS
• NASA объявило конкурс на лучший интерфейс «умных часов» для астронавтов
• Вдохновляющий минимализм в веб-дизайне
• Полное руководство по созданию шрифтов (The Ultimate Guide on How to Create a Font)
• 3 техники анимации для UX дизайнеров, которые желательно знать (3 animation techniques UX designers need to know)
• Color vs Contrast: что приносит больше конверсий
• 10 умирающих трендов в веб-дизайне
• Иконка меню-гамбургер не работает (The Hamburger Menu Doesn’t Work)
• Работает ли гамбургер-меню в сайтах для настольных компьютеров? (Do hamburger menus work on desktop sites?)
• Следим за глазами: как отслеживать разрывы между кликами (и зачем это нужно) (Eyetracking: How to Watch Gap Between the Clicks (and Why))
• Дизайн веб-интерфейсов для детей (Designing Web Interfaces For Kids)
• Используем все преимущества минимализма в веб-дизайне (Taking Full Advantage of Minimalism in Web Design)
• Главные десять ошибок, которые заставляют ваш сайт выглядеть непрофессионально (Top 10 Mistakes that Make your Website Look Unprofessional)
• Почему все веб-сайты должны использовать видео (Why websites should all be using video)
• Четыре научные техники для редизайна сайта (4 research techniques for website redesigns)
• Семь советов при выборе подходящих фото в Adobe Stock (7 Tips to Taking the Guess Work Out of Choosing Stock Imagery)
• Использовать ли Sketch? Вот в чем вопрос (To Sketch, or not to Sketch?)
• Семь советов от мастеров фотошопа по повышению Вашей продуктивности (7 Photoshop Master Tips to Boost Your Productivity)
• Создание одно-слойного текстового ретро-эффекта в Photoshop-е (Create a One-Layer Retro Text Effect in Adobe Photoshop)
• Создание с нуля классного постера «Железный Человек» в Photoshop (Create Stunning «Iron Man» Fan Art From Scratch in Photoshop)
• Создание иллюстрации виски со льдом в Illustrator-е CS5 (Create Vector Whiskey on the Rocks Using Adobe Illustrator CS5)

Подборка бесплатных дизайнерских печенек

• Бесплатные ретро-фотографии
• Цветные и плоские иконки для вашего дизайна
• Actions для фотошопа (Best Free Photoshop Actions)
• Ретро-бейджики (30 Awesome Free Retro Badges You Can Download)
• Набор векторных изображения для создания обхемных изометрических офисных пространств (3D Isometric Worlds)
• Наборы UI для мобильных приложений (35+ Best Free Mobile Apps UI Kits For Your Next Project)
• Мокапы для дизайна упаковок (33 Free PSDs to Mockup Your Packaging Designs)
• Векторные фоны (Download 25 Creative Polygonal Illustration Freebies)
• Иллюстраци с полигональной геометрией (Download 25 Creative Polygonal Illustration Freebies)
• PSD шаблона посадочной страницы (DIFF Psd Landing Page)
• Упаковки иконок с изображениями жестов (18+ Latest Free Touch Gesture Icon Packs)
• Набор иконок Prestashop (Free Download: Prestashop Official Icon Pack)
• Иконки посвященные WiFi и радио-сигналам (36 FREE EXCLUSIVE VECTOR ICONS: WIFI CONNECTIONS ICONS)
• Иконки нарисованные одной линией (One line — Free Startup icons)
• Иконочный шрифт Foundation (Foundation Icon Fonts)
• NEW INDUSTRY — «промышленный» шрифт без засечек
• Arctic — современный slab шрифт (Arctic || Free Typeface)

Новости

• Alphabet
  
  • Google станет частью нового холдинга Alphabet
  • Как российские и западные ИТ-эксперты отреагировали на превращение Google в холдинг Alphabet
  • Китай заблокировал сайт холдинга Google сразу после его запуска
  • Вернуться к истокам и выйти за рамки. Почему Google – это снова поиск, а Alphabet нацелен на большее
  • Кто такой Сундар Пичаи, возглавивший Google
  • Зачем Google сменила имя?
  • Зачем Google стала частью Alphabet
  • Создание Alphabet – это ход абсолютно в стиле Ларри Пейджа
  • Microsoft пошутила над новой компанией Google доменом abc.wtf

• Moz назвал важнейшие факторы ранжирования в Google в 2015 году
• В результате обновления алгоритма Google mobile-friendly выиграли сайты с минимальным трафиком
• Microsoft изменяет механизм активации в Windows 10: теперь статус оборудования хранится в облаке, а лицензионный ключ отходит в прошлое
• Google запускает сайт демонстрации приложений с открытым кодом для устройств Android
• Twitter запустил API поиска по архиву
• «Твиттер» отменил ограничение длины личных сообщений
• Reuters обвиняет «Лабораторию Касперского» в создании фальшивой малвари
• «ВКонтакте» расформировывает отдел маркетинга
• «Одноклассники» запустили групповые видеоканалы

Занимательное

• Какими были первые компьютерные вирусы
• Facebook рассказал о статистике «ха-ха» и LOL в соцсети
• Доллар-клуб: Маск, Брин, Цукерберг и другие ИТ-предприниматели, работающие за символическую зарплату
• Как авторы приложения для сплетников Secret прогорели и стали миллионерами
• Что такое карта мыслей и как с ней работать
• «Сделай всё красиво»: что можно узнать за первый месяц работы настройщиком компьютеров
• Что опасного в новой Windows?
• Как селфи стали самой доступной психотерапией
• О чем думает инвестор, когда ему презентуют стартап
• Велопарковки, кафе, мэрия: как 300 жителей Иннополиса управляют городом через Telegram
• В чём истинное предназначение «Косынки» и «Сапёра»
• Apple рассказала о проценте женщин-инженеров в компании
• Машинная эволюция: в Кембридже создали робота, который создаёт других роботов, улучшая их с каждым поколением
• Созданы саморазвивающиеся роботы
• Миф великой личности: роль масков и джобсов в истории
• howdns.works. Наглядно о том, как работает DNS

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

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

ссылка на оригинал статьи http://habrahabr.ru/post/264859/