Посмотрел видео о классах "CSS - Who Wins?", а перед этим задумался об инструментах для CSS

Если стиль блока включает несколько классов, то какие "главнее"? Когда порядок объявления стилей в css файлах второстепенен? Эти вопросы особенно важны, когда у элемента разметки много классов (BEM). Как лучше использовать префиксы, оптимизаторы, json2html, Map HTML to JSON, beautifytools, CSS Optimizer, What is Modernizr? Best Free CSS Optimization Tools to Tune up Your Site, Bootstrap wrapper no conflict

Как преобразовать html2json & json2html

Весь современный фронтенд "настроен" на работу с данными в формате Json. Если я захочу "стырить" данные с чужого сайта, том можно не ваять парсер, а вырезать кусок кода, преобразовать его в json, и использовать свойства объекта javascript, например, в шаблонизаторе... Не уверен, что такой комплесный парсер лучше... Но идея красивая. Потому наскоро нашел с пяток вариантов, вот примеры Pure JavaScript HTML5 Parser, gulp-to-json, Demo online

Процесс загрузки HTML страницы в браузер на примерах из документации Гугл

Популярное изложение основ Блокировка анализатора и асинхронный JavaScript. Здесь же ссылки на несколько примеров страниц с разными вариантами загрузки скрипта. JavaScript позволяет извлечь из DOM скрытый объект span, который может не отображаться в модели визуализации, а затем заменить текст внутри объекта (с помощью команды .textContext) и вычисляемое свойство стиля (с none на inline). Готово! На странице появится текст Hello interactive students!.

Упражняемся с 'node debug' по видео из поста 'Отладка-скриптов-в-nodejs'

1)Supervisor (для перезапуска автоматического скриптов. 2) node debug - штатный дебаггер, можно задать (setbreakpoint или) в коде скрипта debugger; , node-inspector - добавляет GUI Chrome с возможностью просматривать файлы

Как склеивать, чистить, сжимать файлы css и javascript

Здесь я еще не знал, как вообще работать с этими файлами. Но уже занл про GULP плагины. Потому решил найти онлайн инструменты для быстрой склейки (например) CSS... Нашел много чего: PageSpeed Insights, What is the Closure Compiler..., jsmin, Разработка → Разгони свой сайт – автоматическая СКЛЕЙКА + GZIP...

Gulp-swig c плагином Gulp, и мануал по ejs

Поймал себя на том, что мысль о собственном шаблонизаторе становится все более навзчивой. Причем, я ее гоню..., выгоняю..., а потом она приходиит ко мне под видом gulp-ejs. Оказалось, что в описании к Gulp-swig исчерпывющий набор примеров...
Так что здесь я начал было разбирать, как использовать Swig and YAML front-matter, но все оказалось очень просто, так что пост короткий.
Update: Оказалось, что в посте нет ссылки на документацию, нашел вот здесь Liquid-for-Designers... и еще есть пара ссылок в комментариях к посту.

Видео и презентация о CSS3 Flexible Box

Нашел статью на Хабре, потом видео (30 минут), свойства Flexbox надо использовать. Вспомнил, что недавно, просматривая учебник по CSS3, не обратил внимние..., вернее, не захотел вникать (без надобности) в новый подход к выравниванию html-блоков. Исправлюсь..., для тренировок буду испоьзовать примеры с **w3schools.com

Видео и презентация CSS3 Flexible Box

Нашел статью на Хабре, потом видео (30 минут), свойства Flexbox надо использовать. Вспомнил, что недавно, просматривая учебник по CSS3, не обратил внимние..., вернее, не захотел вникать (без надобности) в новый подход к выравниванию html-блоков. Исправлюсь..., для тренировок буду испоьзовать примеры с **w3schools.com

Читаю раздел "Browser Rendering Optimization" и Google developers tools

Почему браузер "подвисает" при отрисовке страницы, или, почему страница видна, а прокрута заблокирована? Как посмотреть, что и почему тормозит?
Здесь много ссылок, тема мне так понравилась, что не смог все изложить (запомнить) последовательно, при первом же чтении регулярно посещал "второстеенные" страницы по ссылкам на "главных" страницах... Пришлось в конце поста добавлять ссылки с пояснениями. С них, пожалуй, и надо начинать. Кроме того, здесь картинки из раздела Производительность визуализации документации Гугла.