Новости фронтенда в еженедельном подкасте сообщества «Веб-стандарты»
The podcast Веб-стандарты is created by Сообщество «Веб-стандарты». The podcast and the artwork on this page are embedded on this page using the public podcast feed (RSS).
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:07 Анонсы State of
00:02:37 CSS-функции
00:23:27 Zed и Zeta
00:38:25 Ленивые картинки
00:49:12 Interop 2025
01:24:18 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Анонсы State of
• State of AI 2025
• State of React 2024
CSS-функции
• CSS Custom Functions are coming
• Early return example
Zed и Zeta
• Zed now predicts your next edit with Zeta
• Dataset for Zeta
Ленивые картинки
• Stop lazy loading product and hero images
Interop 2025
• Interop 2025 Dashboard
• Interop Readme
• Webkit: Announcing Interop 2025
• Interop 2025: another year of web platform improvements
• Igalia Chats: Interop 2025
• Mozilla: Launching Interop 2025
Ответы на вопросы
Ведущие: Полина Гуртовая, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:00:59 Chrome 133
00:23:43 Firefox 135
00:30:44 Deno против Oracle
00:39:13 Медленный URLPattern
00:51:48 GitHub Copilot
01:06:14 Дырка в Vitest
01:13:47 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome 133
• Chrome 133 release notes
• New in Chrome 133
Firefox 135
Deno против Oracle
• Oracle justified its JavaScript trademark with Node.js
Медленный URLPattern
• You should not use URLPattern to route HTTP requests on the server
GitHub Copilot
• GitHub Copilot: The agent awakens
Дырка в Vitest
• Remote code execution in Vitest API
Ответы на вопросы
Ведущие: Андрей Мелихов, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:23 Create React App точно всё
00:18:54 Системные шрифты
00:33:30 Правильный сервер на Node.js
00:49:13 Как сжать весь npm
01:06:31 Вы не поняли Electron
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Create React App точно всё
• Deprecate Create React App officially
• CRA breaks with React 19 and needs deprecation notices
Системные шрифты
• It’s time to ditch BlinkMacSystemFont and -apple-system
• Implementing system fonts on Booking
Правильный сервер на Node.js
• The modern way to write JS servers
Как сжать весь npm
• My failed attempt to shrink all npm packages by 5%
Вы не поняли Electron
• Things people get wrong about Electron
Ответы на вопросы
Ведущие: Алексей Симоненко, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:30 Lightpanda Browser
00:16:20 CSS @sheet
00:34:41 Мощный attr
00:55:07 Temporal приходит в JS
01:11:41 Bun 1.2
01:40:24 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Lightpanda Browser
CSS @sheet
• CSS @sheet
• Declarative shadow DOM style sharing
Мощный attr
Temporal приходит в JS
• JavaScript Temporal is coming
• MDN: Temporal
• Gecko: Temporal
• WebKit: Temporal
• Chromium: Temporal
Bun 1.2
• Bun 1.2
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:23 Chrome 132
00:36:54 Стилизуемый select
00:54:15 Interop 2024
01:04:21 Text-align: justify
01:21:52 Формы в dialog
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome 132
• Chrome 132
• New in Chrome 132
Стилизуемый select
• Updates to the customizable select API
• Request for developer feedback: customizable select
• CodePen: Customizable Select
Interop 2024
Text-align: justify
• Justified text: better than expected?
Формы в dialog
• Use cases for form method="dialog"
Ответы на вопросы
Ведущие: Вадим Макеев, Андрей Мелихов, Алексей Симоненко, Полина Гуртовая
Темы
00:00:00 Интро
00:01:18 Firefox 134
00:11:48 Новости Node.js
00:17:37 Нативный TS в Node.js
00:33:43 WinterTC
00:46:36 Баланс текста
01:03:42 Атрибуты импортов
01:14:55 JS Rising Stars
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Firefox 134
• Firefox 134 for developers
• Box alignment + Absolute positioning
Новости Node.js
• Node v22.13.0 (LTS)
• Node.js 23.6.0
Нативный TS в Node.js
• Node’s new built-in support for TypeScript
• Eleventy proposal: Add first-party core support for TS
WinterTC
• WinterTC
• Runtime compatibility
Баланс текста
Атрибуты импортов
• ECMAScript feature: import attributes
JS Rising Stars
• 2024 JavaScript Rising Stars
• 4.5 Million (Suspected) Fake Star Stars in GitHub
• GitHub StarScout
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Юлия Миоцен
Темы
00:00:00 Интро
00:01:23 Стандарт source maps
00:08:05 Новинки React 19
00:38:01 Гибкость @keyframes
00:52:10 Разметка в Веб-альманахе
01:34:26 3D кот на CSS
01:43:35 Анимация неанимируемого
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Стандарт source maps
• TC39 Source map format specification
Новинки React 19
• React v19
• Custom Elements Everywhere
• React 19 and Web Component Examples
• React 19 introduces full support for custom elements
Гибкость @keyframes
Разметка в Веб-альманахе
• The Web Almanac 2024: Markup
3D кот на CSS
Анимация неанимируемого
• Glowing border animation with a smooth stop
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко, Юлия Миоцен, Полина Гуртовая, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:02:40 Полина кормит белок
00:25:17 Никита играет кол-ми-мейби
00:54:18 Андрей красит плитку в ванной
01:06:43 Юля ждёт группу 16 лет
01:17:24 Лёша спрашивает шляпу
01:36:39 Вадим атакует титанов
01:53:34 Отвечаем на вопросы
02:14:47 Желаем хорошего
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Всякие ссылки
• Видео на Ютубе
• Полина и Никита решают задачи по вёрстке с CodeRun
• Канал Никиты про разработку
• Канал Никита про другое
• Канал Андрея в Телеграме
• Доклад Андрея «Безопасная песочница»
• Доклад Юли на CSS Day
• Подкаст Вадима «Любимые пластинки»
• Сторис Вадима с байкпакинга
• Сторис Вадима с концертов
• Пул-реквест Вадима в BCD про вьюпорт
• Плейлист Вадима с концертов
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Полина Гуртовая
Темы
00:00:00 Интро
00:01:53 CSS-вишлист
00:33:44 Custom Ident в CSS
00:48:57 Наконец-то text-box-trim
01:02:53 State of JS 2024
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
CSS-вишлист
Custom Ident в CSS
Наконец-то text-box-trim
• Why I’m excited about text-box-trim as a designer
State of JS 2024
• State of JavaScript 2024
• State of Developer Ecosystem Report
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Никита Дубко
Темы
00:00:00 Интро
00:01:23 Новинки Safari 18.2
00:34:08 Firefox без DNT
00:43:22 Baseline 2024
01:06:34 Релиз JS-движка Boa
01:13:10 Container Queries на Netflix
01:22:35 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Новинки Safari 18.2
• WebKit Features in Safari 18.2
Firefox без DNT
• How do I turn on the Do Not Track feature?
Baseline 2024
• Baseline 2024: more tools to help web developers
• Dynamic-range media query
• Prefers-contrast media query
• Exception handling (WebAssembly)
• RUM Insights
Релиз JS-движка Boa
Container Queries на Netflix
• Unlocking the power of CSS container queries: lessons from the Netflix team
Ответы на вопросы
• Storing times for human events
• Managing Timezones in JavaScript Apps
Ведущие: Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:07 Новинки CSS 2024
00:33:51 Require ES-модулей
00:48:44 TypeScript 5.7
01:02:31 Слоистая спекуляция
01:17:55 Усталость от React
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Новинки CSS 2024
Require ES-модулей
TypeScript 5.7
Слоистая спекуляция
• A layered approach to speculation rules
Усталость от React
• Why I forever ditched React for Go, HTMX, Templ
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:15 Адвент-календари
00:04:44 Firefox 132 и 133
00:34:05 Сложности Interop
00:55:04 Когда радоваться новым фичам
01:11:14 Zed и внешние контексты
01:27:55 Отобрать JavaScript у Oracle
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Адвент-календари
• Advent of TypeScript
• Advent of Code
• HTMHell Advent Calendar
• 12 Days of Web
Firefox 132 и 133
• Firefox 132 for developers
• Firefox 133 for developers
• The Large, Small, and Dynamic Viewports
• Snow-fall Web Component
Сложности Interop
• Interop and Hard Problems
• Interop 2025 must drop secret vetos
Когда радоваться новым фичам
• When is the right time to share our excitement about new web features?
Zed и внешние контексты
• The Context Outside the Code
• Chat GPT Code Interpreter and Browser Compat Data
Отобрать JavaScript у Oracle
• Deno v. Oracle: Canceling the JavaScript Trademark
Ответы на вопросы
Ведущие: Алексей Симоненко, Полина Гуртовая
Темы
00:00:00 Интро
00:00:51 Красивые CSS-рамки
00:17:47 Кому бы продать Chrome
00:31:00 Web AI summit
01:02:35 AI-помощники в коде
01:29:39 Первый LTS Deno
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Красивые CSS-рамки
• Creative borders with background-clip
Кому бы продать Chrome
• DOJ says Google must sell Chrome to crack open its search monopoly
Web AI summit
AI-помощники в коде
• Does Copilot improve code quality? Here’s what the data says
• Does Copilot improve code quality? Here’s how we lie with statistics
Первый LTS Deno
• Deno 2.1 first-class Wasm support
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:23 Chrome 131
00:20:06 Chrome DevTools
00:33:12 HDR в EXIF
00:49:54 Результаты State of HTML
01:27:22 Куки из Web Almanac
01:53:28 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome 131
Chrome DevTools
• What’s new in DevTools, Chrome 131
HDR в EXIF
• Google and Apple are making HDR photos work better
• ISO/DIS 21496-1. Gain map metadata for image conversion
Результаты State of HTML
Куки из Web Almanac
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:15 Safari TP 207
00:10:01 Мгновенная навигация
00:36:03 Опасный npm
00:51:28 Безголовые компоненты
01:12:41 Width: stretch
01:18:45 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Safari TP 207
• Safari Technology Preview 207
Мгновенная навигация
• How to achieve instant navigations on the web
Опасный npm
• Hundreds of code libraries posted to NPM try to install malware on dev machines
• Typosquat campaign targeting Puppeteer users
Безголовые компоненты
• How headless components became the future for building UI libraries
Width: stretch
• The stretch keyword: a better alternative to width: 100% in CSS?
Ответы на вопросы
Ведущие: Полина Гуртовая, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:14 Короче
00:01:57 Safari 18.1 и 18.2
00:14:20 Опять masonry
00:29:06 Svelte 5
00:39:18 Next.js 15
00:52:14 Тулинг на чужих языках
01:11:52 Новинки редактора Zed
01:21:18 GitHub Universe
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Короче
• LTS Node.js 22
• State of React
• New CSS logo?
Safari 18.1 и 18.2
• WebKit Features in Safari 18.1
• Safari 18.2 Beta
Опять masonry
• CSS Grid vs Masonry
• Masonry syntax
Svelte 5
Next.js 15
Тулинг на чужих языках
• Why I’m skeptical of rewriting JS tools in “faster” languages
Новинки редактора Zed
GitHub Universe
• Bringing developer choice to Copilot
• JavaScript not top-1 anymore
Ответы на вопросы
Ведущие: Юлия Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:01:15 Chrome DevTools 130
00:17:56 Прогресс на CSS
00:25:44 Словари сжатия
00:41:03 CSS-пластилин
00:50:04 Blockquote правильно
01:05:35 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome DevTools 130
• What’s new in Chrome DevTools 130
Прогресс на CSS
• How to Create Filling CSS Loaders Using One Element
• CSS Loaders
Словари сжатия
• An Introduction to Shared Compression Dictionaries
CSS-пластилин
• Drawing with CSS: Clay Character
Blockquote правильно
• I’ve Been Doing Blockquotes Wrong
• The blockquote element
• Blockquotes in Screen Readers
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко, Юлия Миоцен, Андрей Мелихов
Темы
00:00:00 Интро
00:01:08 Результаты State of CSS
00:25:17 Флексы на лице
00:27:40 Chrome 130
00:41:37 Node.js 22 и 23
01:00:31 JS0 и JSSugar
01:26:03 Гиперреализм
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Лайв на Ютубе
Результаты State of CSS
Флексы на лице
Chrome 130
• Chrome 130
• Intent to Ship: Improvements to styling of details and summary
• Improvements to details styling, phase 1
Node.js 22 и 23
• LTS — Node v22.10
• Current — Node v23
• In the future using top-level await might because a backwards compatibility break in Node
JS0 и JSSugar
Гиперреализм
• Гиперреалистичные контролы
• Ana Tudor on CodePen
• CSS Articles by Temani Afif
• Jhey on CodePen
Ответы на вопросы
Ведущие: Вадим Макеев, Никита Дубко, Юлия Миоцен, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:15 Safari TP
00:10:28 Стилизуемый select
00:30:12 Кейс для Style Queries
00:43:24 Маркетинг Deno
01:03:17 Переобувание Figma
01:13:26 Свежие CSS-демки
01:19:30 Совместимость скринридеров
01:27:04 Перфоманс CSS-селекторов
01:36:07 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Safari TP
• Safari Technology Preview 205
Стилизуемый select
• The new stylable select element
• Open UI: Customizable Select Element
• Customizable Select
Кейс для Style Queries
• Getting Started with Style Queries
Маркетинг Deno
Переобувание Figma
• Our Approach to Designing UI3
• UI3 Is Now Available For Everyone
Свежие CSS-демки
• A swinging robot
• A bouncing robot
• Pogo stick
• Character Modeling in CSS
• CSS Music Video
Совместимость скринридеров
Перфоманс CSS-селекторов
• I wasted a day on CSS selector performance
Ответы на вопросы
Ведущие: Вадим Макеев, Полина Гуртовая, Алексей Назаренко, Алексей Симоненко
Темы
00:00:00 Интро
00:02:40 Safari TP
00:12:58 Firefox 131
00:29:19 CrUX History API
00:34:06 Веб-компоненты и фреймворки
01:06:14 Что такое веб-компоненты
01:21:19 Веб-компоненты в рантайме
01:32:30 Зачем нужны веб-компоненты
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Алексей Назаренко
• Divelopers, канал про разработку в Телеграме
Safari TP
• Safari Technology Preview 204
Firefox 131
• Firefox 131 for developers
• Supercharging CSS variables debugging
CrUX History API
Веб-компоненты и фреймворки
• Web Components are not the future
• Web Components are not the future — they’re the present
• Web components are okay
• Web Components are not framework components — and that’s okay
Что такое веб-компоненты
• 2023 State of Web Components: today’s standards and a glimpse into the future
• Introduction to Web Components
Веб-компоненты в рантайме
• Two-up web component
• Table-saw web component
Зачем нужны веб-компоненты
• Web Component CG
• Web Components Demystified online course
• Frontend Masters: Learn to Create Web Components
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:23 Выбираем CSS masonry
00:27:34 Подробности про Express 5.0
00:42:20 Speed Brain от CloudFlare
01:00:14 Новый дэшборд BCD Watch
01:07:44 Очень сложный блог
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Выбираем CSS masonry
• Feedback needed: How should we define CSS masonry?
Подробности про Express 5.0
• What’s New in Express.js 5.0
Speed Brain от CloudFlare
• Introducing Speed Brain: helping web pages load 45% faster
Новый дэшборд BCD Watch
• Announcing BCD Watch
• What is Baseline?
Очень сложный блог
Ответы на вопросы
Ведущие: Андрей Мелихов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:38 Дырявый Arc
00:14:50 Chrome 129
00:24:40 Safari 18
01:07:59 Новости Baseline
01:18:22 Deno 2.0 RC
01:33:59 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Дырявый Arc
• Arc: Incident Report
• Gaining access to anyone’s browser
Chrome 129
Safari 18
• Safari 18.0
• Safari 18.1 beta
Новости Baseline
• Baseline landing
• Baseline-status web component
• Web platform release notes
• Release notes RSS
Deno 2.0 RC
• Deno 2.0 Release Candidate
• Deno 2 Arrives With Long-Term Support, npm Compatibility
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:22 State of HTML
00:04:39 Safari TP 203
00:20:12 iPadOS 18 в Европе
00:29:57 FID уходит
00:36:58 Стилизуемый селект
00:50:24 CSS Values and Units L5
01:16:30 Stage 2.7 в ES
01:28:44 Interest Invokers
01:38:32 Express 5.0
01:56:46 Самый быстрый SSR
02:09:47 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
State of HTML
Safari TP 203
• Release Notes for Safari TP 203
iPadOS 18 в Европе
• Baby steps are also steps
• Update on iPadOS 18 apps distributed in the European Union
FID уходит
• Chrome ends support for First Input Delay
Стилизуемый селект
• Request for developer feedback: customizable select
CSS Values and Units L5
• Introducing CSS Values and Units Level 5
• CSS Values and Units Module Level 5
Stage 2.7 в ES
• Inside ECMAScript: JavaScript Standard Gets an Extra Stage
Interest Invokers
• Interest Invokers (Explainer)
Express 5.0
• Express 5.0
• Express Forward
• ReDoS the web
Самый быстрый SSR
• An SSR Performance Showdown
• Wow you must be using Bun!
Ответы на вопросы
• Zen
Ведущие: Вадим Макеев, Полина Гуртовая, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:15 Firefox 130
00:19:25 Безопасный JPEG XL
00:32:38 Бета Chrome 129
00:46:30 С Google Fonts или без
01:04:12 Темы и схемы
01:23:52 Как убрать SVG из JS
01:50:23 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Firefox 130
• Firefox 130 for developers
• Contributions to Gecko: registered custom props
• Contributions to Gecko: content-visibility
• Contributions to Gecko: fetchpriority
• Intent to prototype: Blocking third-party cookies
• Third Party Cookies Must Be Removed
• Cookies Having Independent Partitioned State (CHIPS)
Безопасный JPEG XL
Бета Chrome 129
С Google Fonts или без
• Google-fonts-testing
• Suggestion: Stable Font File URLs
Темы и схемы
Как убрать SVG из JS
Ответы на вопросы
Ведущие: Алексей Симоненко, Полина Гуртовая, Никита Дубко
Темы
00:00:00 Интро
00:01:15 Новинки Safari TP 202
00:26:17 Доступность в интеропе
00:42:10 Атрибут autocorrect
00:53:44 Чего не хватает в CSS
01:32:58 Что нужно RSS
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Новинки Safari TP 202
Доступность в интеропе
• Interop 2024: Chrome at 100% for the accessibility
Атрибут autocorrect
• Define the autocorrect attribute as standard
• Add the autocorrect attribute
• HTML: Autocorrection
• WebKit: Correct autocorrect attribute
Чего не хватает в CSS
• What missing from CSS
• Monitor JS custom props
• Resize observer for container queries
Что нужно RSS
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:53 State of CSS 2024
00:05:03 Новинки Chrome 128
00:18:21 DevTools в Chrome
00:29:04 Выбор браузеров на iOS
00:40:39 Тёмные темы и компоненты
00:56:11 Corepack уходит из Node.js
01:07:49 JPEG XL в iPhone 16
01:19:32 Прозрачность в видео
01:31:58 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
State of CSS 2024
Новинки Chrome 128
DevTools в Chrome
Выбор браузеров на iOS
• New Changes to the Browser Choice Screen and Default Apps on iOS in the EU
Тёмные темы и компоненты
• Page and Component Adaptive Light/Dark
• Прототип тёмной темы
Corepack уходит из Node.js
• Node.js Takes Steps Towards Removing Corepack
JPEG XL в iPhone 16
• iPhone 16 could let you shoot in JPEG-XL for 3x smaller files
Прозрачность в видео
• Video with alpha transparency on the web
Ответы на вопросы
• Chrome 127
• Keyboard-focusable scroll containers
• Ship KeyboardFocusableScrollers or disable it by default
Ведущие: Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:31 Safari TP 201
00:05:40 Работа над View Transitions
00:09:04 AI в Chrome
00:22:16 Resource Override
00:35:05 Зачем blocking=render
00:57:10 Веб умирает
01:20:28 Шрифт с подсветкой кода
01:33:35 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Safari TP 201
• Safari Technology Preview 201
Работа над View Transitions
• Intent to prototype: View Transitions Module Level 1
• WebKit about to express support for cross-document View Transitions
AI в Chrome
• A Quick Look at AI in Chrome
Resource Override
• Browser Extension Resource Override
Зачем blocking=render
• Blocking=render: Why would you do that
Веб умирает
Шрифт с подсветкой кода
• Font with Built-In Syntax Highlighting
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко, Андрей Мелихов, Полина Гуртовая
Темы
00:00:00 Интро
00:01:15 Избавились от Gulp
00:03:19 Firefox 129 и WebDriver BiDi
00:29:02 Бета Chrome 128
00:49:19 Dynamic import maps
01:04:17 Какой JS-рантайм быстрее
01:16:34 Нативный Chrome на iOS
01:24:40 Ванильный дауншифтинг
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Избавились от Gulp
Firefox 129 и WebDriver BiDi
• Firefox 129 for developers
• Deprecating CDP Support in Firefox
• Announcing Official Puppeteer Support for Firefox
• WebDriver BiDi production-ready in Firefox, Chrome and Puppeteer
• Playwright with Webdriver BiDi protocol
Бета Chrome 128
• Chrome 128 beta
• Now in Baseline: animating entry effects
• Update CSS backdrop-filter to use mirror edgeMode
Dynamic import maps
• Intent to Prototype: Dynamic import maps
• Shipping support for module script integrity in Chrome & Safari
Какой JS-рантайм быстрее
• Benchmarking AWS Lambda Cold Starts Across JavaScript Runtimes
• Bun v1.1.22
• Who is the fastest? Node.js, Bun, or Deno
Нативный Chrome на iOS
Ванильный дауншифтинг
Ответы на вопросы
Ведущие: Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:46 Safari 17.6 и TP
00:06:33 Astro Server Islands
00:15:55 Бета TypeScript 5.6
00:29:23 Фикс для CSS-нестинга
00:41:21 Атрибут handwriting
00:45:17 Google индексирует SPA
01:06:59 Deno был неправ
01:19:29 Как выйти из веба
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Safari 17.6 и TP
• Safari 17.6
• Safari Technology Preview 200
Astro Server Islands
Бета TypeScript 5.6
• Announcing TypeScript 5.6 Beta
Фикс для CSS-нестинга
• Intent to Ship: The Nested Declarations Rule
Атрибут handwriting
• Intent to Prototype: HTML handwriting attribute
Google индексирует SPA
• How Google handles JavaScript throughout the indexing process
Deno был неправ
• What we got wrong about HTTP imports
Как выйти из веба
Ответы на вопросы
Ведущие: Андрей Мелихов, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:38 Chrome 127 и DevTools
00:20:53 Reading-flow
00:34:16 Google не отдаст куки
00:49:20 Invoker Commands
01:00:38 Слёт TC39
01:14:20 TypeScript в Node.js
01:28:52 Zed стал норм
01:33:01 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome 127 и DevTools
• Chrome 127
• Let me explain to you how it works in 4 minutes
• CSS font-size-adjust is now in Baseline
• New in Chrome 127
• What’s new in DevTools, Chrome 127
Reading-flow
• Request for developer feedback on reading-flow and elements with display: contents
Google не отдаст куки
• Google is keeping cookies in Chrome after all
• A new path for Privacy Sandbox on the web
• Results from Privacy Sandbox APIs testing
• Third party cookies must be removed
Invoker Commands
• An update on invokers: Invoker commands in HTML
Слёт TC39
• Summary of the June 2024 TC39 plenary in Helsinki
• The Future of Source Maps
TypeScript в Node.js
• Add --experimental-strip-types
• Fix the bug caused by fast api changes in v22.5.0
Zed стал норм
• Remoting Development in Zen for everyone
• Remote Development
Ответы на вопросы
• Dialogs and popovers seem similar. How are they different?
Ведущие: Вадим Макеев, Алексей Симоненко, Полина Гуртовая
Темы
00:00:00 Интро
00:02:17 Доклады и лайвы
00:08:22 Такой приватный Safari
00:45:37 Анимация height: auto
00:55:00 Копирование SVG
01:00:20 Ускорение Notion
01:16:03 Node.js 22
01:23:46 Инкрементальные шрифты
01:44:28 State of React 2023
01:55:32 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Доклады и лайвы
• CSS Day 2024
• Character Modeling in CSS
• Лайв Доки: Решаем задачи на CSS
• Лайв Вадима и Юли: Птички на CSS
Такой приватный Safari
• Safari Technology Preview 199
• Private Browsing 2.0
• Mozilla: Topics API — negative
• Mozilla Specification Positions
Анимация height: auto
• Intent to Ship: CSS interpolate-size property and calc-size() function
• CSS can FINALLY animate height: auto!
• Intrinsic Sizing In CSS
Копирование SVG
• Seamless SVG copy-paste on the web
• Firefox: Implemented the SVG clipboard reader and writer
Ускорение Notion
• Notion browser speedup
• A future for SQL on the web
Node.js 22
• It's now possible to try out node:sqlite in the latest Node.js
• Node v22.5.0
Инкрементальные шрифты
• Incremental Font Transfer
• IFT/IFT-Explainer.md
• We are interested in feedback if some parts are unclear
State of React 2023
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:50 Firefox 128
00:25:53 Особенный доступ Chromium
00:45:03 Как дела у Interop 2024
01:05:23 Редактор Zed на Linux
01:14:19 Непонятки View Transition
01:37:59 Усталость от GitHub
01:52:50 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Firefox 128
• Firefox 128 for developers
• Privacy-Preserving Attribution
Особенный доступ Chromium
• It turns out Google Chrome includes a default extension
• Google Meet extension in Vivaldi
• Compute Pressure Level 1
• Web.Dev: Compute Pressure API
• Firefox website permissions
Как дела у Interop 2024
• Interop 2024 mid-year update
• Features missing in just one engine
Редактор Zed на Linux
Непонятки View Transition
• Misconceptions about view transitions
Усталость от GitHub
• GitHub is starting to feel like legacy software
• Pierre
Ответы на вопросы
Ведущие: Полина Гуртовая, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:16 Где нас слушать
00:02:42 Safari TP
00:08:06 LoAF в Chrome
00:24:51 Браузер Ladybird
00:45:24 MDN HTTP Observatory
00:58:43 SVG Working Group
01:04:34 Prompt API
01:25:17 Планы ESLint
01:36:19 Хорошие формы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Где нас слушать
• Deezer
• Amazon Music
• YouTube Music
• Все платформы на сайте
Safari TP
LoAF в Chrome
Браузер Ladybird
MDN HTTP Observatory
• MDN HTTP Observatory
• SSL Server Test
SVG Working Group
• Call for Participation: SVG Working Group Charter Approved
Prompt API
Планы ESLint
• What’s coming next for ESLint
Хорошие формы
• Forget “show, don’t tell”. Engage, don’t show!
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Юлия Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:01:07 Chrome DevTools 126
00:11:12 Фичи ES2024
00:26:22 Редизайн Figma и AI-дизайн
01:38:52 ESM-гармония
01:57:40 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome DevTools 126
• What’s new in DevTools, Chrome 126
Фичи ES2024
• ECMAScript 2024: What’s new?
• TC39: Deferred Import Evaluation, Error.isError(), RegExp Escaping, Promise.try
• Proposals level up
Редизайн Figma и AI-дизайн
• Config 2024 in review
• Inside the redesigned Figma, where your work takes center stage
• Making Figma work better for freelancers and agencies
• Meet Figma AI: Empowering designers with intelligent tools
• The right code for your design system
• 420-й выпуск
• Stack the deck with Figma Slides
• Config 2024
• Drive design system adoption with Code Connect
• Designing for code: creative tools on hard mode
• How to build for, and with, Gen Z
• Walking the path: prototyping game UI with focus-based navigation
ESM-гармония
• Npm and Node.js should do more to make ES Modules easy to use
• How JS is finally improving the module experience
• 5 ways javascript is improving modules for developers
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:23 Видео с Web Engines Hackfest
00:04:51 Бета Chrome 127
00:21:59 Apple обидели в Японии
00:31:30 State of JS 2023
01:13:42 Условия в CSS
01:33:06 TypeScript 5.5
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Видео с Web Engines Hackfest
• The Web Engines Hackfest 2024
• Why Source Maps don’t always work
Бета Chrome 127
• Chrome 127 beta
• Restrict PNA for subresources from public websites to secure contexts
• Private Network Access
Apple обидели в Японии
• Japan ends the AppleBrowserBan
State of JS 2023
Условия в CSS
• Inline conditionals in CSS?
• What is the MVP for inline conditionals on custom properties?
• Inline conditionals in CSS, now?
TypeScript 5.5
Ответы на вопросы
Ведущие: Алексей Симоненко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:38 Chrome 126
00:20:51 Элемент permission
00:37:23 Firefox 127
00:56:52 Бета Safari 18
01:26:13 CSS-эксплейнеры
01:41:46 Node.js 22
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Chrome 126
• New in Chrome 126
• Mozilla: View Transitions API
• SVGs via use w/o xmlns don’t render in M126
Элемент permission
• An origin trial for a new HTML permission element
• Page Embedded Permission Control
• Firefox Origin Trials
Firefox 127
• Firefox 127 for developers
• Enable CHIPS in Nightly
• Cookies Having Independent Partitioned State (CHIPS)
Бета Safari 18
• News from WWDC24: WebKit in Safari 18 beta
• Videos: Safari & Web
• Build immersive web experiences with WebXR
• Wolvic
• Optimize for the spatial web
• What’s new in CSS
• Safari 18 Beta Release Notes
• I collected compat data for Safari 18 beta and updated BCD
CSS-эксплейнеры
• Mesh gradients in CSS
• CSS Gap Decorations Level 1
Node.js 22
• Node v22.3.0
• Mocking
• Snapshot testing
Ответы на вопросы
Ведущие: Андрей Мелихов, Полина Гуртовая, Вадим Макеев
Темы
00:00:00 Интро
00:01:07 Нативная карусель
00:16:43 WebAssembly JSPI
00:28:39 Стили popover/dialog
00:43:05 Просто htmx
01:04:17 Gap и cap в CSS
01:16:53 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Нативная карусель
• Carousel explainer
• ARIA Authoring Practices Guide
WebAssembly JSPI
• WebAssembly JSPI has a new API
Стили popover/dialog
• Resetting default popover styles
• Resetting default dialog styles
Просто htmx
• htmx: Simplicity in an Age of Complicated Solutions
• JS Party. htmx: a new old way to build the web
• Modern client-side routing: the Navigation API
Gap и cap в CSS
Ответы на вопросы
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:54 Font-smoothing в Firefox
00:09:49 Firefox внедряет @property
00:22:22 LLM для альтов в Firefox
00:35:30 Стилизация details
00:41:56 Edge без React
00:53:53 HTML для разработчиков
00:59:15 SVG-заброшка
01:19:24 Миграция на ESLint 9
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Font-smoothing в Firefox
• Gecko: Intent to prototype and ship: -webkit-font-smoothing property
Firefox внедряет @property
• Gecko. Intent to ship: CSS @property / properties-and-values API
• Explainer: calc-size() function
• Let css-properties-values-api ride the trains
• Firefox Trains
LLM для альтов в Firefox
• Experimenting with local alt text generation in Firefox Nightly
Стилизация details
• CSS Pseudo-Elements L4: details-content
Edge без React
• An even faster Microsoft Edge
HTML для разработчиков
• HTML: Edition for Web Developers
SVG-заброшка
• Browsers prioritize what to implement based on dev demand, except for SVG
• Update on the Layer Based SVG Engine (LBSE) in WebKit
• SVG sprites stacks technique stopped working in Chrome 126
• SVG sprites: old-school, modern, unknown, and forgotten
Миграция на ESLint 9
• Introducing the ESLint Configuration Migrator
Ответы на вопросы
Ведущие: Андрей Мелихов, Вадим Макеев, Полина Гуртовая
Темы
00:00:00 Интро
00:01:23 Бета Chrome 126
00:13:27 Google A/I
00:45:00 Web Platform Dashboard
00:59:35 Новинки фреймворков
01:08:43 SolidStart
01:18:11 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Бета Chrome 126
• Chrome 126 beta
• Mutation events will be removed from Chrome
Google A/I
• YouTube: Web at Google I/O 2024
• 10 updates from Google I/O 2024: Unlocking the power of AI for every web developer
• Web Neural Network API
• WebAssembly and WebGPU, part 1
• WebAssembly and WebGPU, part 2
• Built-in AI
Web Platform Dashboard
• Announcing the Web Platform Dashboard
• Web Platform Status
• Establishing transparency and fairness guidelines for feature visibility
Новинки фреймворков
• What’s new in JavaScript Frameworks (May 2024)
SolidStart
• SolidStart 1.0: The Shape of Frameworks to Come
• Moving from RSC to SolidStart
Ответы на вопросы
• Codeium
Ведущие: Юлия Миоцен, Вадим Макеев, Андрей Мелихов, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:08 State of HTML 2023
00:35:18 Chrome 125
00:41:34 Chrome DevTools
00:53:20 Firefox 126
01:06:55 Safari 17.5
01:13:50 React и Remix
01:26:47 Про дизайн
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
State of HTML 2023
• State of HTML 2023
• Исходник футболки State of HTML
• Web Components Demystified
Chrome 125
Chrome DevTools
• What’s new in DevTools, Chrome 125
• Understand errors and warnings better with Gemini
Firefox 126
Safari 17.5
• WebKit Features in Safari 17.5
React и Remix
• Merging Remix and React Router
• React Compiler
Про дизайн
• Figma 101
• How to hold your phone when tapping
Ответы на вопросы
Ведущие: Полина Гуртовая, Вадим Макеев, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:02:56 CSS для поиска по странице
00:10:58 Safari TP
00:19:37 Scroll-Driven Animations
00:31:37 Современные CSS-фигуры
00:39:31 Серверные компоненты и CSS
00:55:33 Всё новое в цветах
00:59:26 Wasm vs. Docker
01:09:21 Wasm для VS Code
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
CSS для поиска по странице
• Intent to Prototype: Find-in-page highlight pseudos
• ::search-text is coming soon thanks to my colleagues at Igalia
• Intent to Ship: Stop modifying author-defined selection colors
Safari TP
• Release Notes for Safari Technology Preview 194
Scroll-Driven Animations
• Unleash the power of Scroll-Driven Animations
• Firefox: Intent to prototype: CSS Anchor Positioning
Современные CSS-фигуры
• The Modern Guide For Making CSS Shapes
Серверные компоненты и CSS
• CSS in React Server Components
Всё новое в цветах
• CSS Color Modules and Changes, Part I
• OKLCH в CSS: почему мы ушли от RGB и HSL
Wasm vs. Docker
• Wasm vs. Docker: Performant, Secure, and Versatile Containers
• Using WebAssembly for Extension Development
Wasm для VS Code
• An update on plugin security
Ответы на вопросы
Ведущие: Алексей Симоненко, Полина Гуртовая, Никита Дубко
Темы
00:00:00 Интро
00:01:46 PWA с табами
00:06:48 Гугл и куки
00:16:38 Выборы Masonry
00:39:49 Arc на Windows
00:42:06 iPad тоже виноват
00:46:41 Новости Deno
00:53:18 Copilot Workspace
01:23:53 Local-first
01:40:02 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
PWA с табами
• Blink Intent to Ship: Tabbed web apps
Гугл и куки
• Update on the plan for phase-out of third-party cookies on Chrome
• Investigation into Google’s ‘Privacy Sandbox’ browser changes
Выборы Masonry
• Help us invent CSS Grid Level 3, aka “Masonry” layout
• An alternative proposal for CSS masonry
• For me, it’s a masonry layout isn’t a grid
• Moving Masonry to its own display type would be our recommended path forward
Arc на Windows
• Arc on Windows is finally here
iPad тоже виноват
• EU: We designated Apple’s iPadOS as a gatekeeper under the DMA
• Commission designates Apple’s iPadOS under the Digital Markets Act
Новости Deno
• Deno puppeteer
• Performance improvement for language server
Copilot Workspace
• GitHub Copilot Workspace: Welcome to the Copilot-native developer environment
• Copilot Workspace
Local-first
• Cool frontend arts of local-first: storage, sync, conflicts
Ответы на вопросы
Ведущие: Вадим Макеев, Никита Дубко, Юля Миоцен
Темы
00:00:00 Интро
00:02:09 Google I/O и Config
00:09:32 Translation API
00:19:57 Новости Figma
00:30:01 Invokers
00:47:31 Длинные альты
00:56:48 Атрибуты и свойства
01:06:37 Бета React 19
01:23:59 Ответы на вопросы
Поддержите нас
Простой способ сказать «спасибо» и попасть в закрытый чат.
Google I/O и Config
• Web at Google I/O, May 14
• Config 2024 lineup
Translation API
Новости Figma
• What We Launched at Framework 2024
• The Right Code for Your Design System
Invokers
• Invoking elements by using only HTML: A first look at invokers
Длинные альты
Атрибуты и свойства
• HTML attributes vs DOM properties
• Putting React In The Browser
Бета React 19
• React 19 Beta
• React 19 Beta Upgrade Guide
Ответы на вопросы
Ведущие: Вадим Макеев, Полина Гуртовая, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:31 Naked CSS/JS Day
00:06:55 Firefox 125
00:18:16 Chrome 124
00:31:24 Chrome Beta 125
00:36:52 Edge Dashboard
00:49:17 Редактор Zed
01:01:33 Локальная Llama
01:08:23 JSON с комментами
01:16:20 Будущее Node.js
01:37:23 Новинки Node.js 22
Поддержите нас
• Патреон
• Бусти
• USDT: TDWwqYaDVuXQuoDUxAGc3DtttPaFqLcJ1F
• TON: UQDtdvstR13TCLsiD-L_LGzkehbPQkpuP5UnOybzutwG0HUg
Naked CSS/JS Day
Firefox 125
• Firefox 125 for developers
• No close of popover with click/touch on backdrop in mobile Safari
• On popover accessibility: what the browser does and doesn’t do
• Positioning anchored popovers
• Semantics and the popover attribute: what to use when?
Chrome 124
• New in Chrome 124
• BCD: Add WebSocketStream
Chrome Beta 125
Edge Dashboard
• Introducing the Edge 2024 web platform top developer needs dashboard
• 2024 web platform top developer needs
Редактор Zed
• From Vim to Zed
• Roadmap Zed
• Extensible Language Support in Zed
• Zed/extensions: language
Локальная Llama
• Llama 3 as a Copilot in VSCode
JSON с комментами
• Bun won’t error when package.json has comments or trailing commas
• Pkg-types now supports package.json with jsonc
Будущее Node.js
• Trip report: Node.js collaboration summit
• Nodejs/next-10
• Npm-esm-vs-cjs
Новинки Node.js 22
• Node.js 22
• Support requireing synchronous ESM graphs
• Move deprecated utils to runtime deprecation
Ответы на вопросы
Ведущие: Вадим Макеев, Алексей Симоненко, Полина Гуртовая, Никита Дубко, Юля Миоцен
Темы
00:00:00 Интро
00:05:00 Как DMA помог браузерам
00:13:26 Safari TP 192
00:21:46 Уровни заголовков
00:39:38 Select на стероидах
00:45:40 Переключатель темы в браузере
00:59:11 JS в PDF
01:05:13 Svelte узнал HTML
01:14:31 Песочница в V8
01:21:39 CSS-миксины на слоях
01:33:26 Figma развлекается
Поддержите нас
• Патреон
• Бусти
• USDT: TDWwqYaDVuXQuoDUxAGc3DtttPaFqLcJ1F
• TON: UQDtdvstR13TCLsiD-L_LGzkehbPQkpuP5UnOybzutwG0HUg
Как DMA помог браузерам
• Exclusive: EU’s new tech laws are working; small browsers gain market share
• Aloha
Safari TP 192
• Release Notes for Safari Technology Preview 192
Уровни заголовков
• Intent to Prototype: headingstart attribute
• Consider adding a headinglevelstart attribute
Select на стероидах
• We were planning to ship selectlist, now we’re reusing the select
• Stylable Select Element
Переключатель темы в браузере
• What if you had real control over Light Mode / Dark Mode on a per-site basis?
• Browser Security Bugs that Aren’t: JavaScript in PDF – text/plain
JS в PDF
• PDF.js
Svelte узнал HTML
• Svelte parses HTML all wrong
• Jumping HTML tags. Another reason to validate your markup
Песочница в V8
CSS-миксины на слоях
• Layered Toggles: Optional CSS Mixins
• Mixins three ways
Figma развлекается
• Flippy Bird
• Surf the web like it’s 1999
• Framework by Figma
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:03:27 Бета Safari 17.5
00:12:50 Learn JS
00:16:16 Как помочь CSS
00:30:51 Сигналы в JS
00:48:52 Container Queries
01:05:41 WebAIM Million
01:29:25 HTML-санитайзер
01:35:36 Bun 1.1
01:51:23 Ответы на вопросы
Поддержите нас
• Патреон
• Бусти
• USDT: TDWwqYaDVuXQuoDUxAGc3DtttPaFqLcJ1F
• TON: UQDtdvstR13TCLsiD-L_LGzkehbPQkpuP5UnOybzutwG0HUg
Бета Safari 17.5
• Safari 17.5 Beta Release Notes
Learn JS
• Learn JavaScript
• MDN Curriculum: JS fundamentals
Как помочь CSS
• For the last 4 years, I spent most of my time on CSS specs
• OddBird Open Source
• Getting Started in Standards
Сигналы в JS
• A proposal to add signals to JavaScript
Container Queries
• An Interactive Guide to CSS Container Queries
• MDN: @container
WebAIM Million
• The WebAIM Million
• Инклюзивный ананас
HTML-санитайзер
Bun 1.1
Ответы на вопросы
Ведущие: Вадим Макеев, Юля Миоцен, Алексей Симоненко
Темы
00:00:00 Интро
00:01:54 Safari TP
00:11:15 CSS JIT
00:15:25 Apple Developer на YouTube
00:23:21 AI в FigJam
00:29:36 Бета Chrome 124
00:46:16 Iterator helpers в V8
00:53:49 Новые и старые сетки
01:00:54 View Transitions
01:20:52 Color Mix
01:30:13 Gulp 5
Поддержите нас
Safari TP
• Release Notes for Safari Technology Preview 191
• Implementing Vertical Form Controls
CSS JIT
• Overview of WebKit’s CSS JIT Compiler
Apple Developer на YouTube
• YouTube/@AppleDeveloper
• Safari & Web
AI в FigJam
Бета Chrome 124
Iterator helpers в V8
• Iterator helpers, V8
• mdn/browser-compat-data
Новые и старые сетки
• Why UI designers should understand Flexbox and CSS Grid
• Seven year anniversary of CSS Grid
• CSS Grid Layout Module L2
• CSS Grid Layout Module L3
View Transitions
• View Transitions L2 to public Working Draft
• CSS View Transitions Module L1
• CSS View Transitions Module L2
Color Mix
• Creating color palettes with the CSS color-mix() function
• MDN: color-mix()
• PostCSS Color Mix Function
Gulp 5
• Gulp 5.0
Ответы на вопросы
Ведущие: Вадим Макеев, Андрей Мелихов, Юля Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:02:09 Firefox 124
00:13:06 Chrome 123
00:40:13 Chrome DevTools
00:49:20 JSPI в WASM
00:53:11 Config и Hackfest
00:55:26 Доступность Popover
01:10:55 Все JS-рантаймы
01:24:40 Где открывать ссылки
01:40:22 Надёжные автогриды
01:50:33 Ответы на вопросы
Поддержите нас
Firefox 124
Chrome 123
• New in Chrome 123
• Choosing Between gzip, Brotli and zStandard Compression
Chrome DevTools
• What’s new in DevTools (Chrome 123)
JSPI в WASM
• WebAssembly JSPI is going to origin trial
• WebAssembly JavaScript Promise Integration
• Firefox: Support WebAssembly JSPI
Config и Hackfest
• Config 2024
• Web Engines Hackfest
Доступность Popover
• On popover accessibility: what the browser does and doesn’t do
Все JS-рантаймы
• Runtime compatibility
• WinterJS 1.0
• WinterCG
• Elysia 1.0
Где открывать ссылки
• Arguments for opening links in a new tab or window
Надёжные автогриды
• Building a Rock Solid Auto Grid
Ответы на вопросы
• Smart Interface Design Patterns Checklists
• Дока: figure, figcaption
• How do you figure?
• HTML The figure element
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко
Темы
00:00:00 Интро
00:02:17 Speedometer 3.0
00:21:36 Новинки SVG
00:26:58 AI уходи, или NoML
00:39:53 Writingsuggestions
00:47:23 Зашитый alt
01:02:22 TypeScript 5.4
01:11:11 Раскраска Node.js
01:15:41 Стриминг HTML
01:31:21 Ответы на вопросы
Поддержите нас
Плейлист со всеми эпизодами на Ютубе
Speedometer 3.0
• Announcing Speedometer 3.0
• Firefox
• Safari
• Chrome
• Edge
Новинки SVG
• Intent to Ship: SVG context-fill and context-stroke
AI уходи, или NoML
• NoML Open Letter
• Artificial Intelligence Act: MEPs adopt landmark law
Writingsuggestions
• Writingsuggestions attribute to control UA-provided writing assistance
• WHATWG HTML PR
• WebKit
• Chrome
Зашитый alt
• Thoughts on embedding alternative text metadata into images
• Got back from a quick trip to Copenhagen
TypeScript 5.4
Раскраска Node.js
• Node.js added utility for text formatting
• ai/nanocolors
• alexeyraspopov/picocolors
Стриминг HTML
• HTML Streaming and DOM Diffing Algorithm
• Streaming HTML out of order without JavaScript
• Стриминг веб-компонентов
Ответы на вопросы
• Srcset and sizes interaction with container queries
• Allow source elements to query container sizes
Ведущие: Андрей Мелихов, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:31 Safari 17.4
00:33:22 Safari TP
00:42:13 Стейджи в WHATWG
00:49:38 Бесконечность в CSS
00:58:23 Нильсен, AI и доступность
01:11:22 Deno JSR
01:24:47 Ответы на вопросы
Поддержите нас
Safari 17.4
• WebKit Features in Safari 17.4
• Джен Симмонс в Мастодоне
• Happy iOS 17.4 browser choice day
Safari TP
• Release Notes for Safari TP 190
Стейджи в WHATWG
• WHATWG Stages
• Specification Acceptance Stages
• WHATWG Specs
Бесконечность в CSS
• Playing with Infinity in CSS
Нильсен, AI и доступность
• Nielsen needs to think again
• Accessibility Has Failed
• Переводы Якоба Нильсена на Вебмасконе
Deno JSR
• Introducing JSR, the JavaScript Registry
• JSR: Deno’s New JavaScript Package Registry
Ответы на вопросы
Ведущие: Юля Миоцен, Вадим Макеев, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:15 Опять switch в Safari
00:07:08 PWA вернулись на iOS
00:19:09 Запуск MDN Curriculum
00:33:25 Figma купила конструктор
00:47:03 Опасные полифилы с CDN
00:57:34 Интерактивные примеры :has
01:14:57 Микропакеты вроде is-number
01:27:31 Пет-проекты и корпорат
Поддержите нас
Опять switch в Safari
PWA вернулись на iOS
• Update on apps distributed in the EU
• OWD: Apple backs off killing web apps, but the fight continues
• EU seeks to investigate Apple over cutting off web apps
• So, what exactly did Apple break in the EU?
• Apple will NOT remove PWA support on iOS
Запуск MDN Curriculum
• MDN Curriculum
• Lift-off: The MDN Curriculum launch
• GitHub: mdn/curriculum
Figma купила конструктор
Опасные полифилы с CDN
• Polyfill is owned by a Chinese company
• Huh polyfill.io got sold
• Polykill
• Subresource Integrity
Интерактивные примеры :has
• CSS :has() Interactive Guide
• WPT: CSS selectors
• MDN :has()
Микропакеты вроде is-number
• Why does is-number package have 59M weekly downloads?
Пет-проекты и корпорат
• Стек пет-проектов против рабочего
• What Is A Single-page Application?
Ответы на вопросы
Ведущие: Никита Дубко, Андрей Мелихов, Алексей Симоненко, Вадим Макеев
Темы
00:00:00 Интро
00:01:46 Chrome 122
00:20:03 Бета Chrome 123
00:37:51 Firefox 123
00:57:43 Safari TP 189
01:02:57 Подсветка без разметки
01:13:36 Стандарты и тоглеры
Поддержите нас
Chrome 122
• New in Chrome 122
• What’s new in DevTools (Chrome 122)
• Device Posture API
Бета Chrome 123
• Chrome 123 beta
• LightningCSS v1.24.0
• Support for align-content in block and table layouts
• Velvette
Firefox 123
Safari TP 189
• Release Notes for Safari Technology Preview 189
• Say hello to our new mascot, Rocket Turtle
Подсветка без разметки
• Syntax Highlighting code snippets with Prism and the Custom Highlight API, Брамус
Стандарты и тоглеры
• CSSWG Participants: Roman Komarov
• CSS Day
• HTML: Add switch attribute to input
• Open UI: Switch proposal
Ответы на вопросы
Ведущие: Андрей Мелихов, Алексей Симоненко, Вадим Макеев
Темы
00:00:00 Интро
00:01:46 Apple и веб
00:50:44 CSS-функции
01:08:55 Полезный AI Magika
01:21:35 Новые фичи Set
01:35:05 Новая метрика INP
Поддержите нас
Apple и веб
• Update on apps distributed in the European Union
• It’s Official, Apple Kills Web Apps in the EU
• PWA added to Home Screen are forced to open in Safari
CSS-функции
• Intent to Prototype: CSS functions
• Sass
• Chrome Feature: CSS functions
Полезный AI Magika
• Magika
Новые фичи Set
• Union, intersection, difference, and more are coming to JS Sets Фил Нэш
• Method Shorthand Syntax Considered Harmful Мэтт Покок
Новая метрика INP
• Interaction to Next Paint becomes a Core Web Vital on March 12
• Does your favorite JS framework pass the new Core Web Vitals
• Page-speed.dev
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:07 Интенты Blink
00:19:19 Safari TP 188
00:34:35 Сайты в панели
00:41:50 Никаких PWA в Европе
00:52:19 JS-рантайм в AWS
01:00:47 JS Rising Stars
01:25:36 Монополия npm
01:40:13 Ответы на вопросы
Поддержите нас
Интенты Blink
• CSS line-clamp property
• Open and closed pseudo-classes
• Web Monetization
Safari TP 188
• Release Notes for Safari TP 188
Сайты в панели
Никаких PWA в Европе
• iOS 17.4 seems to remove web app support for EU users
JS-рантайм в AWS
• LLRT: A low-latency JavaScript runtime from AWS
• Excited to see LLRT finally open for everyone
JS Rising Stars
• 2023 JavaScript Rising Stars
Монополия npm
• Node.js community debate over enabling Corepack
Ответы на вопросы
Ведущие: Алексей Симоненко, Вадим Макеев, Никита Дубко, Юля Миоцен
Темы
00:00:00 Интро
00:01:31 Бета Chrome 122
00:11:29 Outlook стал хуже
00:24:10 Arc ищет за вас
00:52:24 Dev-режим в Figma
01:09:17 Знайте SVG
01:26:12 Interop 2024
02:00:34 Ответы на вопросы
Поддержите нас
Бета Chrome 122
• Chrome 122 beta
• Restoring the old filter bar in Network panel to Chrome 121
Outlook стал хуже
Arc ищет за вас
• Meet Act II of Arc Browser: A browser that browses for you
• Arc Search: Find Everything, Faster
Dev-режим в Figma
Знайте SVG
• Responsive SVGs
• Learn SVG by drawing an arrow
Interop 2024
• Interop 2023 dashboard
• Interop 2024 dashboard
• Bocoup
• Chrome
• Edge
• Firefox
• Igalia
• Safari
• URL Standard
Ответы на вопросы
• Демо Сергея
• Исходники демо.
• Can I use: showOpenFilePicker
• showOpenFilePicker с фолбэком
• Томас Штайнер
Ведущие: Вадим Макеев, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:24 Chrome 121
00:16:03 Chrome DevTools
00:22:31 Firefox 122
00:40:34 Firefox DevTools
00:44:36 Safari 17.3 и бета 17.4
00:53:10 Альтернативные движки на iOS
01:37:17 Ответы на вопросы
Поддержите нас
Chrome 121
Chrome DevTools
• What’s new in Chrome 121 DevTools
Firefox 122
Firefox DevTools
• Firefox DevTools Newsletter
• Prototype v1.7.3 API documentation | $$
Safari 17.3 и бета 17.4
• WebKit Features in Safari 17.3
• Safari 17.4 Beta Release Notes
• О переводчиках и псевдоэлементах
Альтернативные движки на iOS
• Using alternative browser engines in the European Union
• Update on apps distributed in the European Union
• Using alternative browser engines in the European Union
• Platform Tilt
• Open Web Advocacy
• The F-Word: Origins of Apple browser ban and hope for changes
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:30 Safari заговорил
00:14:08 Firefox за справедливость
00:27:00 Браузерная политика
00:52:27 Можно без кук
01:03:29 Abbr не работает
01:15:19 Кейсы для :has
01:22:11 Ответы на вопросы
Поддержите нас
Safari заговорил
• Jen Simmons on Interop, WebKit Releases, and New CSS Features in Safari
Firefox за справедливость
• Platform Tilt: Documenting the Uneven Playing Field
• Platform Tilt
Браузерная политика
• Igalia Chats: Browser Politics and You
Можно без кук
• We removed advertising cookies, here’s what happened
Abbr не работает
• Using abbr Element with title Attribute
Кейсы для :has
• The anywhere combinator :has()
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:04:45 Safari TP
00:17:49 Новости Chrome
00:28:39 Опять сторонние куки
00:41:44 Этика веба от W3C
00:59:09 API работы с файлами
01:13:32 UI для толстых пальцев
Поддержите нас
Веб-стандарты везде
Instagram, Threads, Twitter/X, Mastodon, Bluesky, Telegram, VK, Facebook, Apple Podcasts, Google Podcasts, Spotify, Яндекс Музыка, CastBox, Звук, YouTube.
Safari TP
• Release Notes for Safari Technology Preview 186
• MDN :scope
Новости Chrome
• Persistent permissions for the File System Access API
• Don’t open Chrome when launching a PWA on Mac
Опять сторонние куки
• Google is finally killing cookies. Advertisers still aren’t ready
Этика веба от W3C
• W3C TAG Ethical Web Principles
• Put user needs first (Priority of Constituencies)
API работы с файлами
• Introducing fsx: a modern filesystem API for JavaScript
UI для толстых пальцев
• Designing better target sizes
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Никита Дубко
Темы
00:00:00 Интро
00:00:53 Переход на Firefox
00:29:15 Как сломать npm
00:39:59 Веб-компоненты
00:57:07 React Server Components
01:15:56 Нет/да Next.js
01:32:52 Ответы на вопросы
Поддержите нас
Переход на Firefox
• In 2024, please switch to Firefox
Как сломать npm
• The package that broke npm (accidentally)
Веб-компоненты
• Alternate futures for web components
React Server Components
• React Server Components: the good, the bad, and the ugly
Нет/да Next.js
• Why I won’t use Next.js
• Why I’m using Next.js
Ответы на вопросы
Ведущие: Андрей Мелихов, Юля Миоцен, Вадим Макеев, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:31 Аналитика
00:17:49 Как дела у Никиты
00:32:27 Радует CSS 5
00:40:50 Надежда на Servo
00:48:06 Text-wrap: balance
00:52:15 Порадовал linear
00:56:51 Sustainability
01:01:36 Радует Baseline
01:10:25 Как дела у Юли
01:15:38 AI в тренде
01:23:48 Развитие интеропа
01:33:53 Веб-компоненты
01:36:38 Новое дыхание PWA
01:42:57 Arc всем нравится
01:46:38 Как дела у Андрея
01:53:16 Плохо Adobe
02:00:17 Расстроил нестинг
02:06:26 Медленные куки
02:09:57 Ничего в CSS
02:18:26 Скучно в дизайне
02:20:33 Зачем Anchor
02:26:15 Не убедил search
02:29:21 Медленный ESM
02:31:29 Как дела у Вадима
02:37:08 Как дела у Лёши
02:41:03 Планы на год
Поддержите нас
Аналитика
• OKLCH в CSS: почему мы ушли от RGB и HSL
• Веб-стандарты в Мастодоне
• Веб-стандарты в Блюскай
Радует CSS 5
• Introduction and CEO goals and aspirations
Надежда на Servo
• Servo to Advance in 2023
• This year in Servo: over 1000 pull requests
Text-wrap: balance
• Chrome Canary: text-wrap: balance in action
Порадовал linear
• linear()
Sustainability
• Introducing Web Sustainability Guidelines
• Tagged “web sustainability”
Радует Baseline
• Baseline
• Reflections on AI Explain: A postmortem
AI в тренде
Развитие интеропа
Веб-компоненты
• HTML Web Components Are Having a Moment
Новое дыхание PWA
• Web Push for Web Apps on iOS and iPadOS
• Native mobile apps are optional for B2B startups in 2024
Arc всем нравится
• Arc 1.0
Плохо Adobe
Расстроил нестинг
Медленные куки
• Third-party cookies in Chrome
• Saying goodbye to third-party cookies in 2024
Ничего в CSS
• Ничего интересного в CSS за год
Зачем Anchor
• Tether elements to each other with CSS anchor positioning
Не убедил search
Как дела у Вадима
• Новогодний эпизод LP с концертами года
Как дела у Лёши
• Старикам здесь не место?
• Код Сурка
• Фронтенд-олимпиада
Ответы на вопросы
Ведущие: Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:31 Figma без Adobe
00:15:48 Safari TP
00:58:16 Firefox 121
01:15:12 Vue 2 всё
01:18:30 Плохое в HTML
01:53:45 Ответы на вопросы
Поддержите нас
Figma без Adobe
• Figma and Adobe are abandoning our proposed merger
Safari TP
• Release Notes for Safari Technology Preview 185
• Input type=checkbox switch
• Align-content in block layout
• Web-Facing Change PSA: align-content CSS property for blocks
• WebGPU now available for testing in Safari Technology Preview
Firefox 121
• Firefox 121.0, See All New Features, Updates and Fixes
• Firefox 121 for developers
• Firefox DevTools Newsletter 121
Vue 2 всё
• Vue 2 is Approaching End Of Life
Плохое в HTML
• HTML: The Bad Parts
• The road to HTMHell is paved with semantics
Ответы на вопросы
Ведущие: Вадим Макеев, Юля Миоцен, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:03:04 Safari 17.2
00:37:09 Нестинг в DevTools
00:48:41 Интенты Chrome
01:03:02 WebDriver BiDi
01:13:31 Декларативный Shadow DOM
01:18:55 Design Tools Survey
01:34:13 Исследование доступности
01:48:15 ООП в JS
02:00:14 Ответы на вопросы
Поддержите нас
Safari 17.2
• WebKit Features in Safari 17.2
• Exclusive accordions exclude
• Linear easing generator
• WWDC 2023: What’s new in web apps
Нестинг в DevTools
• How would you like to see Chrome DevTools handle Nesting?
• Вопрос в Твиттере
• Вопрос в Мастодоне
Интенты Chrome
• Intent to Prototype: Locked Mode API
• Intent to Ship: field-sizing CSS property
WebDriver BiDi
• Puppeteer Support for the Cross-Browser WebDriver BiDi Standard
• Web Application Testing Today
• New Automation Features in Firefox Nightly
Декларативный Shadow DOM
• Declarative Shadow DOM just landed in Firefox Nightly
Design Tools Survey
Исследование доступности
• Исследование настроек доступности
ООП в JS
• How Marketing Changed OOP In JavaScript
Ответы на вопросы
• Юля Бухвалова про SVG
• Блог Сары Суайдан
• Про SVG на MDN
• Про SVG в Доке
• SVG sprites: old-school, modern, unknown, and forgotten
Ведущие: Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:02:33 Safari TP
00:09:21 Chrome 120
00:16:59 2023 год для CSS
00:24:04 Николь Салливан
00:27:17 Chrome и стандарты
00:34:53 JIT-левитация V8
00:44:45 Обновление Baseline
01:09:02 StyleX и CSS-in-JS
01:38:11 Ответы на вопросы
Поддержите нас
Safari TP
• Release Notes for Safari TP 184
Chrome 120
• New in Chrome 120
• Chrome 120 beta
2023 год для CSS
Николь Салливан
• After 5 1/2 years, today is my last day at Google
• Igalia Chats: Nicole Sullivan
Chrome и стандарты
• Why Chromium cares about standards
JIT-левитация V8
• Maglev V8’s Fastest Optimizing JIT
Обновление Baseline
• Baseline’s evolution on MDN
• A definition update for Baseline
• Viewport-relative-units
• Viewport-relative-unit-variants
• MDN/yari
StyleX и CSS-in-JS
• StyleX
• Facebook/stylex
• Introducing StyleX
• Fela
Ответы на вопросы
Ведущие: Юля Миоцен, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:40 Движок Servo
00:09:07 Линейки в селектах
00:15:16 Дэшборд с браузерами
00:19:42 State of JS 2023
00:23:38 Адвенты для всех
00:36:55 Подкаст OTMT
00:42:17 Math-функции в CSS
00:49:55 Особенности @scope
00:57:42 Адаптивное видео
01:08:41 Дизайнеры и разработчики
Поддержите нас
Движок Servo
• This month in Servo: better floats, :has(), color-mix(), and more!
Линейки в селектах
• Firefox: Intent to prototype and ship: hr in select
Дэшборд с браузерами
State of JS 2023
Адвенты для всех
• Advent of CSS
• HTMHell: The UX of HTML
• Advent of Code
• Web Performance Calendar
• Performance.now() 2023
• UXMas
• Designcember
Подкаст OTMT
• Off The Main Thread: WebGPU and Browser Ideologies
Math-функции в CSS
• The New CSS Math: rem() and mod()
Особенности @scope
Адаптивное видео
• How to Use Responsive HTML Video (...and Audio!)
Дизайнеры и разработчики
• Care beyond code: 7 best design practices for frontend developers
• Как воспитать дизайнера
Ответы на вопросы
Ведущие: Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:46 Firefox 120
00:22:08 TypeScript 5.3
00:30:58 Новые статьи на MDN
00:39:38 Версии Node.js и NODE_ENV
00:53:54 Тюнинг Prettier
01:04:38 Preact не для Next.js
01:10:52 Ответы на вопросы
Поддержите нас
Firefox 120
• Firefox 120 for developers
• Experimental features in Firefox
• -moz-image-rect
TypeScript 5.3
Новые статьи на MDN
• @starting-style
• Transition-behavior
• Overlay
• Animating popovers
Версии Node.js и NODE_ENV
• You are not updating Node.js
• NODE_ENV=production is a lie
Тюнинг Prettier
• Prettier-plugin-void-html
• Add an option to prefer void tags
Preact не для Next.js
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Юля Миоцен
Темы
00:00:00 Интро
00:01:31 Safari TP 183
00:07:05 Invoker в Chrome и Firefox
00:17:49 PiP без вопросов
00:26:34 Новинки Figma
00:36:00 Adobe и Figma S10E01
00:50:06 Container Queries
00:59:45 Веб это Chrome?
01:10:18 Stylelint и ESLint
01:26:53 GitHub Monaspace
01:43:04 Ответы на вопросы
Поддержите нас
Safari TP 183
• Release Notes for Safari Technology Preview 183
Invoker в Chrome и Firefox
• Chrome & Firefox both have experimental support for invoketarget and invokeaction
• A simple counter demo in 9 lines of JS
• Counter app with Invokers
PiP без вопросов
• Automatic picture-in-picture for web apps
Новинки Figma
• Little Big Updates Weekly H2 2023
Adobe и Figma S10E01
• The Figma + Adobe Deal, Explained
Container Queries
• Getting started with CSS container queries
Веб это Chrome?
Stylelint и ESLint
• Stylelint v16.0.0 removed deprecated stylistic rules
• Deprecation of formatting rules
• Node: use biome as formatter
GitHub Monaspace
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:02:01 GitHub Universe
00:30:39 Angular.dev
00:46:18 Знай Юникод
01:01:24 CSS 4, 5, 6
01:30:37 AI в FigJam
Поддержите нас
GitHub Universe
• Universe 2023: Copilot transforms GitHub into the AI-powered developer platform
Angular.dev
• Announcing Angular.dev
• Introducing Angular v17
Знай Юникод
• The Absolute Minimum Every Software Developer Must Know About Unicode in 2023 (Still No Excuses!)
CSS 4, 5, 6
• CSS Feature List
• CSS-Next Community Group
• CSSWG supports efforts to define levels for CSS
AI в FigJam
Ответы на вопросы
Ведущие: Никита Дубко, Андрей Мелихов, Алексей Симоненко, Вадим Макеев
Темы
00:00:00 Интро
00:01:24 Chrome 119
00:12:52 Бета Chrome 120
00:37:48 Новости Firefox
00:55:30 Safari TP
01:06:03 Веб-компоненты
01:33:28 Импорты в Next.js
Поддержите нас
Chrome 119
Бета Chrome 120
Новости Firefox
• These Weeks in Firefox: Issue 148
• Firefox: Intent to prototype Invokers
• Open UI. Invokers (Explainer)
• Feature request: “Always underline links in text” option in Firefox
• GitHub: Underlined Links for Improved Accessibility
Safari TP
• Release Notes for Safari Technology Preview 182
Веб-компоненты
• Blinded By the Light DOM
• Web Components Will Outlive Your JavaScript Framework
Импорты в Next.js
• How we optimized package imports in Next.js
Ответы на вопросы
Ведущие: Алексей Симоненко, Вадим Макеев, Юля Миоцен, Андрей Мелихов
Темы
00:00:00 Интро
00:01:54 Firefox 119
00:14:42 Safari 17.1 и бета
00:28:10 Код-лаб для Passkey
00:40:29 Figma и Adobe
00:53:33 State of React
00:58:25 Node.js Buffer
01:02:56 Шум вокруг Next.js 14
01:12:27 Опять Tailwind
01:29:32 Эмоджи пельменя
Поддержите нас
Firefox 119
• Firefox 119 for developers
• Firefox DevTools Newsletter 119
• Firefox Nightly 120.0a1
• Early Hints: How Cloudflare Can Improve Website Load Times by 30%
Safari 17.1 и бета
• WebKit Features in Safari 17.1
• Safari 17.2 Beta Release Notes
Код-лаб для Passkey
• Passwordless login on the web with passkeys
• Passkeys Codelab
Figma и Adobe
• How Figma and Adobe think they could work together
• Zoom App Marketplace: Figma
State of React
Node.js Buffer
Шум вокруг Next.js 14
• Next.js 14
• How to Think About Security in Next.js
• I don’t understand the hate for this
Опять Tailwind
• Tailwind vs Semantic CSS, Теро Пирайнен
Эмоджи пельменя
• The story of the Dumpling emoji
Ответы на вопросы
Ведущие: Алексей Симоненко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:24 Chrome DevTools
00:13:09 Стилизация скролбаров
00:26:42 Скрытие IP в Chrome
00:37:47 Firefox DevTools
00:49:55 Развитие text-indent
00:58:54 Safari TP
01:12:41 Node.js 21
01:20:06 Маскот Node.js
01:23:52 Eleventy 3.0
01:29:17 Ответы на вопросы
Поддержите нас
Chrome DevTools
• What’s New in DevTools (Chrome 119)
Стилизация скролбаров
• Intent to Ship: CSS Scrollbars: scrollbar-color, scrollbar-width
• Can I use: property: scrollbar-color
Скрытие IP в Chrome
• Intent to Experiment: IP Protection Phase 0
Firefox DevTools
• Firefox Developer Tools
• Responsive Design Mode
• The diversity of investment in Chromium is on a steady decline
Развитие text-indent
• Intent to prototype & ship: CSS text-indent keywords hanging & each-line
• text-indent: hanging each-line
• Can I use: hanging-punctuation
Safari TP
• Safari Technology Preview 181
Node.js 21
Маскот Node.js
• Announcing the Node.js Mascot Design Contest!
• Have a mascot
Eleventy 3.0
• Eleventy: Big v3.0.0 Project Slipstream Changes
Ответы на вопросы
Ведущие: Никита Дубко, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:39 Релиз Chrome 118
00:09:59 Сторонние куки в Chrome
00:22:17 Arc Max и AI
00:36:38 Тёмные темы в CSS
00:46:17 Адаптивное видео
00:55:39 Стандарт Source Maps
01:02:45 Включение ESM в Node.js
01:19:59 OKLCH немного сломан
01:31:34 Ответы на вопросы
Поддержите нас
Релиз Chrome 118
Сторонние куки в Chrome
• Preparing for the end of third-party cookies
Arc Max и AI
Тёмные темы в CSS
• Easy Light-Dark Mode Color Switching with light-dark()
Адаптивное видео
• We’re Bringing Responsive Video Back!
Стандарт Source Maps
• TC39: a task group to standardize source maps
Включение ESM в Node.js
• When to make default-type=module the Node.js default
OKLCH немного сломан
• (ok)lch implementations break the entire purpose for authors
• PostCSS Gamut Mapping Plugin
Ответы на вопросы
Ведущие: Андрей Мелихов, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:08 Новинки Safari
00:22:26 Бета Chrome 119
00:50:01 Divtober
00:56:29 Пересмотр Baseline
01:08:03 Новинки WCAG 2.2
01:15:01 Closure Compiler
Поддержите нас
Новинки Safari
• Release Notes for Safari Technology Preview 180
• Window: open() method
• Simplified Responsive Design Mode
Бета Chrome 119
Divtober
• Хэштег #divtober
• A Single Div
• The Divtober 2023 Collection
• Single Div Drawings
Пересмотр Baseline
• Call for positions: Baseline definition
Новинки WCAG 2.2
• W3C: What’s new in WCAG 2.2,
• Хидде: What’s new in WCAG 2.2
• Леони: What’s new in WCAG 2.2
Closure Compiler
• The Saga of the Closure Compiler and Why TypeScript Won
• Closure Compiler
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:02:02 Firefox 118
00:11:51 Тюнинг CSS-нестинга
00:31:50 HTML-заголовки
00:55:38 Порядок в text-wrap
01:02:52 Фотошоп в вебе
01:19:59 Google Fonts через Cloudflare
01:29:53 Картинки и LCP
01:43:31 Tailwind тоже прав
02:02:22 Ответы на вопросы
Поддержите нас
Firefox 118
Тюнинг CSS-нестинга
• CSS Nesting and the Cascade
• Experiment with support for nested ident-selectors
HTML-заголовки
• Consider adding a headinglevelstart attribute
Порядок в text-wrap
• CSS WG: move balance, stable, pretty out of text-wrap
Фотошоп в вебе
• Photoshop’s journey to the web
• Adobe Photoshop
• System requirements for Photoshop on the web
Google Fonts через Cloudflare
• Cloudflare Fonts: enhancing website font privacy and speed
Картинки и LCP
• The Ultimate Low-Quality Image Placeholder Technique, Гарри Робертс
Tailwind тоже прав
• Classic rock, Mario Kart, and why we can’t agree on Tailwind, Джош Колинсворт
Ответы на вопросы
Ведущие: Алексей Симоненко, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:08 Релиз Safari 17
00:24:39 Safari TP 179
00:28:07 :has в Firefox
00:30:07 State of HTML 2023
00:41:25 Scroll-Driven Animations
00:52:31 TypeScript иногда мешает
01:15:48 Ответы на вопросы
Поддержите нас
Релиз Safari 17
• WebKit Features in Safari 17.0
Safari TP 179
• Release Notes for Safari TP 179
• You can now add a name attribute to the details element
:has в Firefox
• Firefox: Enable :has on Nightly
State of HTML 2023
• State of HTML 2023
• State of HTML 2023 now open!
Scroll-Driven Animations
• Scroll-Driven Animations: Detect if an element can scroll or not
TypeScript иногда мешает
• TypeScript Prevents Bad Things… and Good Things
Ответы на вопросы
Ведущие: Алексей Симоненко, Никита Дубко, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:46 Chrome 117
00:12:20 Бета Chrome 118
00:42:21 Chrome DevTools
00:48:49 Экологичный веб
00:58:19 Миксины и функции в CSS
01:25:54 Interop 2024
01:29:59 Новости Figma
01:36:19 CSS в Figma
01:49:16 Ответы на вопросы
Поддержите нас
Chrome 117
Бета Chrome 118
• Chrome 118 beta
• Postcss-use-logical
• You can scope styles inside of the parent
• Change Display settings for accessibility on Mac
Chrome DevTools
• What’s New in DevTools (Chrome 118)
Экологичный веб
• Introducing Web Sustainability Guidelines
• Web Sustainability Guidelines 1.0 at a Glance
• Mother Nature
Миксины и функции в CSS
Interop 2024
• Submit your proposals for Interop 2024
Новости Figma
• Video in FigJam
• A makeover of embeds
• Lights, camera, action
• Emojis, upgraded
• Stay connected
CSS в Figma
• Container queries: why it’s time to consider them in Figma
Ответы на вопросы
Ведущие: Андрей Мелихов, Никита Дубко, Юля Миоцен, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:46 Safari TP
00:12:10 Планы Firefox
00:25:25 Bun 1.0
00:46:33 Env в Node.js
00:54:32 Каталог веб-фич
01:11:18 Новости Figma
01:21:50 Марсианский плагин
01:26:08 Google и Topics API
01:41:23 Отказ от TypeScript
02:03:48 Ответы на вопросы
Поддержите нас
Safari TP
• Release Notes for Safari TP 178
Планы Firefox
• Firefox: Intent to ship ARIA reflection
• WAI-ARIA 1.3
• Firefox: Intent-to-prototype Text fragments
Bun 1.0
• Bun 1.0
• Node.js compatibility
Env в Node.js
• Node.js includes built-in support for .env files
Каталог веб-фич
• Building the web developer’s catalog of web platform features
• Exploring how to present Web platform features adoptability
• Npm: web-features
• Introducing Baseline
Новости Figma
• It’s baaack: Little Big Updates, with a weekly twist
• #1: Better search
• #2: No more squinting
• #3: Details at a glance
• #4: A new component modal and playground
Марсианский плагин
• Polychrom, Figma Community Plugin
Google и Topics API
• Google gets its way, bakes a user-tracking ad platform directly into Chrome
• DMA: Commission designates six gatekeepers
• Origins of Apple browser ban and hope for changes
Отказ от TypeScript
• Turbo 8 is dropping TypeScript
• Rich Harris: We’re doing this for practical reasons
• ES proposal for type syntax
Ответы на вопросы
• Fast playback with audio and video preload
• [email protected]
Ведущие: Алексей Симоненко, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:23 Firefox 117
00:08:29 Прототип form-sizing
00:20:25 State of CSS 2023
00:58:20 Велосипеды Dropbox
01:20:00 Astro 3.0
01:36:00 Ответы на вопросы
Поддержите нас
Firefox 117
• Firefox 117 for developers
• Firefox DevTools Newsletter
Прототип form-sizing
• Intent to Prototype: form-sizing
• Faster Chrome releases (round two!)
State of CSS 2023
Велосипеды Dropbox
• How we reduced the size of our JS bundles by 33%
• How Edison is helping us build a faster, more powerful Dropbox on the web
Astro 3.0
• Astro 3.0
• Astro View Transitions
Ответы на вопросы
Ведущие: Вадим Макеев
Темы
00:00:00 Интро
00:01:47 Safari TP
00:06:52 Эксклюзивный аккордеон
00:21:22 Термины веб-разработки
Поддержите нас
Safari TP
• Release Notes for Safari TP 177
• WebKit Bugzilla
Эксклюзивный аккордеон
Термины веб-разработки
• WebGlossary.info
• Upgrade Your HTML I–IV
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:08 Chrome 116
00:12:57 Бета Chrome 117
00:37:10 CSS Podcast
00:50:54 Chrome DevTools
01:04:56 Валидация форм
01:18:31 Боль миграции на ESM
Поддержите нас
Chrome 116
• New in Chrome 116
• One-time permissions in Chrome
Бета Chrome 117
• Chrome 117 beta
• CSS Grid Level 2 Examples
• Widows & orphans
• Four new CSS features for smooth entry and exit animations
CSS Podcast
• Why isn’t z-index working?
• Why isn’t the margin applying?
• Why is it overflowing?
• The CSS Podcast
Chrome DevTools
• What’s New in DevTools (Chrome 117)
Валидация форм
• Part 1: HTML and CSS
• Part 2: Layering in JavaScript
• Улучшение формы комментариев
Боль миграции на ESM
• My Experience Modernizing Packages to ESM
Ответы на вопросы
Ведущие: Алексей Симоненко, Юля Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:01:54 Safari TP
00:08:46 Storage Policy в Safari
00:20:56 Переделка Sanitizer API
00:28:17 PWA в Chrome на iOS
00:31:59 Расширения Firefox
00:36:31 Краулер ChatGPT уходи
00:46:40 SVG-анимации
00:52:09 Будущее HTML-шаблонизации
01:06:56 Jamstack точно всё
01:18:50 Ответы на вопросы
Поддержите нас
Safari TP
• Release Notes for Safari Technology Preview 176
Storage Policy в Safari
Переделка Sanitizer API
• Intent to Deprecate: Sanitizer API MVP
PWA в Chrome на iOS
• Chrome on iOS and iPadOS now supports PWA installation
Расширения Firefox
• Prepare your Firefox desktop extension for the upcoming Android release
Краулер ChatGPT уходи
SVG-анимации
Будущее HTML-шаблонизации
• The Future of Native HTML Templating and Data Binding
Jamstack точно всё
• My Journey Away from the JAMstack
• Как я перестал верить технологиям
Ответы на вопросы
Ведущие: Вадим Макеев, Андрей Ситник, Никита Дубко
Темы
00:00:00 Интро
00:02:18 Firefox 116
00:10:49 Ещё Math в CSS
00:19:08 Ускорение Service Workers
00:25:25 WCAG 3 пока рано
00:45:22 P3 в Figma
00:53:58 Style Queries
01:07:44 Astro и View Transitions
01:17:39 PostCSS всё
01:42:29 Ответы на вопросы
Поддержите нас
Firefox 116
• Firefox 116 for developers
• 10 new CSS math functions are now supported in Firefox 118
Ещё Math в CSS
• Intent to Experiment: ServiceWorker static routing API
Ускорение Service Workers
• A repository for the ServiceWorker static routing API
WCAG 3 пока рано
P3 в Figma
• Figma: Manage color profiles in design files
• We brought 49% more colors to the Figma canvas
• Huetone
Style Queries
• A Future of Themes with CSS Container Style Queries
• Светлая и тёмная темы на CSS
Astro и View Transitions
• View Transition API в Astro 2.9
• Джейк Арчибальд в The F-Word
PostCSS всё
• Just migrate to Lightning CSS
• PostCSS
• Поддержать PostCSS
• Lightning CSS
• Поддержать Parcel
• Igalia Chats: 11ty, Open Source and Funding
Ответы на вопросы
Ведущие: Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:23 Arc для всех
00:12:23 State of HTML
00:23:22 HTTP-теги
00:37:20 Web Integrity
01:01:04 Observable в JS
01:06:26 ESM в Vite
01:13:28 Jamstack жив?
01:21:24 OverflowAI
01:27:10 Ответы на вопросы
Поддержите нас
Arc для всех
• The excellent Arc browser is now available for anyone to download
State of HTML
• Help Design the Inaugural State of HTML Survey!
HTTP-теги
• You probably don’t need http-equiv meta tags
Web Integrity
• Google’s nightmare “Web Integrity API” wants a DRM gatekeeper for the web
• Web-Environment-Integrity/explainer.md at main
• Apple already shipped attestation on the web, and we barely noticed
Observable в JS
ESM в Vite
Jamstack жив?
• Is the term Jamstack finished?
OverflowAI
• OverflowAI is a tool, that will also have a VS Code plugin
Ответы на вопросы
Ведущие: Никита Дубко, Юля Миоцен, Алексей Симоненко
Темы
00:00:00 Интро
00:01:39 Бета Chrome 116
00:15:49 Функция linear()
00:33:37 PNG v3
00:43:16 Firefox ESR
00:44:54 Перфоманс
00:56:52 Альтернатива GitHub
01:10:57 Эмоджи в вебе
01:23:52 Ответы на вопросы
Поддержите нас
Бета Chrome 116
• Chrome 116 beta
• Браузеры умеют мгновенно переключать страницу при нажатии Назад
• Debugging websites in Chrome on iOS 16.4+
Функция linear()
• WebKit: Implement linear()
• Anchor Positioning Exploration
• Some new ideas from Apple about how Anchor Positioning could work
PNG v3
• Portable Network Graphics (PNG) Specification (Third Edition)
• PNG Third Edition, Explained
Firefox ESR
• Firefox: Full Speed Into The Future
Перфоманс
• When Optimizations Backfire
• My blog now prerenders all same-origin links, and prefetches all cross-origin ones
Альтернатива GitHub
• Pierre.co
• Finally time to talk about what I’ve been working on
Эмоджи в вебе
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:31 Chrome 115
00:16:04 Технологии шрифтов
00:30:02 Safari TP
00:39:08 Позиции по стандартам
00:56:02 Постмортем AI в MDN
01:17:35 Назад к DOM API
01:30:04 Ответы на вопросы
Поддержите нас
Chrome 115
• New in Chrome 115
• Chrome Platform Status: Fenced frames
Технологии шрифтов
• The new @font-face syntax
• pepelsbey.dev: fonts.css
Safari TP
• Release Notes for Safari TP 174
Позиции по стандартам
• WebKit standards positions (dashboard)
• WebKit standards positions (GitHub)
• Mozilla Specification Positions
Постмортем AI в MDN
• Reflections on AI Explain: A postmortem
• The AI help button is very good, but it should not exist
Назад к DOM API
• Plain Old JavaScript and the DOM
• I have huge respect for Douglas, but…
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:02:02 Firefox 115
00:10:01 Юникод и эмоджи
00:17:17 Контейнеры вместо медиа
00:32:49 DOMContentLoaded
00:42:55 Избавляемся от SVG-in-JS
00:58:16 Бесполезные слэши в тегах
01:21:11 Ответы на вопросы
Поддержите нас
Firefox 115
Юникод и эмоджи
• Intent to Prototype: CSS font-variant-emoji
• Emoji under the hood
Контейнеры вместо медиа
• Can We Query the Root Container?
DOMContentLoaded
• In Defence of DOMContentLoaded
Избавляемся от SVG-in-JS
• Breaking Up with SVG-in-JS in 2023
Бесполезные слэши в тегах
• The case against self-closing tags in HTML
Ответы на вопросы
Ведущие: Андрей Мелихов, Никита Дубко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:02:02 Safari TP
00:05:51 Глубина CSS-нестинга
00:15:46 Chrome DevTools
00:25:19 @property в Firefox
00:27:29 Бета TypeScript 5.2
00:40:58 Navigation API
00:54:55 Реклама и Topics API
01:14:40 AI-ошибка MDN
01:27:48 Ответы на вопросы
Поддержите нас
Safari TP
• Release Notes for Safari Technology Preview 173
Глубина CSS-нестинга
• Limit maximum CSS rule nesting level
• How to fix iOS push subscriptions getting terminated after 3 notifications
Chrome DevTools
• What’s New in DevTools (Chrome 116)
• easeOutBounce
• axe-core
@property в Firefox
• Intent to prototype: Houdini CSS Properties and Values API
Бета TypeScript 5.2
• Announcing TypeScript 5.2 Beta
Navigation API
• Navigation API
• Modern client-side routing: the Navigation API
• WebKit: Pending
• Mozilla: Positive
Реклама и Topics API
• Intent to Ship: Topics API
• Enhancements to the Topics API
AI-ошибка MDN
• Introducing AI Help: Your Trusted Companion for Web Development
• MDN can now automatically lie to people
• No one infromed MDN Steering Committee
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:02:10 State of CSS
00:10:59 Новинки Figma
00:49:22 NestJS 10
00:52:42 Веб на Vision Pro
01:07:21 MDN Playground
01:13:50 Using в TS/JS
01:23:36 Стили для RSS
01:33:07 Ответы на вопросы
Поддержите нас
State of CSS
• State of CSS 2023
• The 2023 State of CSS survey is now open!
• The UI fund
Новинки Figma
NestJS 10
Веб на Vision Pro
• Thoughts from Meet Safari for Spatial Computing
• Meet Safari for spatial computing
MDN Playground
• Introducing the MDN Playground: Bring your code to life!
Using в TS/JS
• TypeScript 5.2’s New Keyword: 'using'
Стили для RSS
Ответы на вопросы
Ведущие: Юля Миоцен, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:39 Safari TP
00:06:53 Сабгриды
00:11:47 Методы итераторов
00:16:48 Chrome для тестирования
00:27:29 Гадания по Figma
00:40:52 Магические импорты
00:53:02 CSS-нестинг
01:12:12 Редактор Zed
01:22:31 Ответы на вопросы
Поддержите нас
Safari TP
• Safari Technology Preview 172
Сабгриды
• Intent to Ship: CSS Subgrid
• Learn CSS Subgrid
• Usage examples of CSS Grid Layout
Методы итераторов
• Intent to Ship: Iterator Helpers
• Methods for working with iterators in ECMAScript
• Iterator Helpers
Chrome для тестирования
• Chrome for Testing: reliable downloads for browser automation
Гадания по Figma
• Config quest
• Predictions for Config
Магические импорты
• JavaScript Imports Under The Hood
CSS-нестинг
• The gotchas of CSS Nesting
• I think we’re going to regret CSS nesting
• Most of the gotchas are just differences from Sass
Редактор Zed
• Zed: Building a platform that open sources itself
• Panic Nova
Ответы на вопросы
Ведущие: Андрей Мелихов, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:01:46 Chrome DevTools
00:19:54 Firefox 114
00:28:27 Apple Web Apps
00:53:22 Новинки Safari 17
01:11:44 Apple в Figma
01:18:00 ESM или CJS
01:28:58 Sass в браузере
01:35:07 Ответы на вопросы
Поддержите нас
Chrome DevTools
• What’s New in DevTools (Chrome 114)
• What’s New in DevTools (Chrome 115)
Firefox 114
• Firefox 114
• CSS Nesting got enabled in Firefox
Apple Web Apps
• News from WWDC23: WebKit Features in Safari 17 beta
• Web Apps on macOS Sonoma 14 Beta
Новинки Safari 17
• Web technology sessions at WWDC23
• iOS 17 automatically removes tracking parameters from links
Apple в Figma
ESM или CJS
• How’s the Node.js ESM migration going
Sass в браузере
Ответы на вопросы
Ведущие: Вадим Макеев, Юля Миоцен, Алексей Симоненко
Темы
00:00:00 Интро
00:01:47 Chrome 114-115
00:18:42 Чего ждать от WWDC
00:28:40 Safari TP
00:35:43 Требования к паролям
00:45:34 Вертикальный ритм
00:56:23 Scroll Driven Animations
01:07:31 CSS Scoping
01:17:29 404 и Web3
01:31:00 Ответы на вопросы
Поддержите нас
Chrome 114-115
• New in Chrome 114
• Chrome 115 beta
• Digging Into The Display Property: The Two Values Of Display
• CSS Display Module Level 3
Чего ждать от WWDC
Safari TP
• Release Notes for Safari TP 171
Требования к паролям
• Safari allows to configure password autofilling
• Password Rules Validation Tool
• Proposal: HTML passwordrules attribute
• Password-rules.json
Вертикальный ритм
Scroll Driven Animations
• Future CSS: Wishes Granted by Scroll-driven Animations
CSS Scoping
• Scoped CSS is Back
• You can scope styles inside of the parent
404 и Web3
• 404 Pages for Framer
• What Is Web 3.0?
Ответы на вопросы
Ведущие: Юля Миоцен, Алексей Симоненко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:46 Arc Boosts
00:14:05 Popover и starting-style
00:31:07 Новинки Figma
00:37:51 HTML-формы
00:50:49 CSS на YouTube
00:56:30 Приватные поля
01:06:10 JS в JS через WASM
01:16:19 Ответы на вопросы
Arc Boosts
Popover и starting-style
• Introducing the popover API
• :root isn’t global
• The Yellow Fade Technique with Modern CSS using @starting-style
Новинки Figma
• Introduction to design systems
• State management in Figma prototypes
• Announcing FigJam screen reader support
HTML-формы
• 11 HTML best practices for login & sign-up forms
CSS на YouTube
• Юля Миоцен на Ютубе
• Стефани Эклс на Twitch
Приватные поля
• JS private class fields considered harmful
JS в JS через WASM
• A JavaScript to Webassembly toolchain
• Javy is now part of the Bytecode Alliance
• Bringing JavaScript to WebAssembly
Ответы на вопросы
• Viewport vs Virtual Keyboard Resize Behavior
• Reinterpret viewport positioned elements wrt virtual keyboard
Ведущие: Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:23 Поддержка и чат
00:05:23 Новости Safari
00:17:55 Снова про Baseline
00:38:20 Firefox 113
00:52:13 TypeScript 5.1 RC
01:05:52 Семантика popover
01:13:32 Перфоманс DOM
Поддержка и чат
• Веб-стандарты на Patreon
• Веб-стандарты на Boosty
Новости Safari
• WebKit Features in Safari 16.5
• Release Notes for Safari Technology Preview 170
Снова про Baseline
• On browser compatibility and support baselines
• Дока: grid
Firefox 113
• Firefox Developer Experience
• Firefox 113
TypeScript 5.1 RC
• Announcing TypeScript 5.1 RC
• Introducing Deopt Explorer
Семантика popover
• Semantics and the popover attribute: what to use when?
• Попап вместо селекта
Перфоманс DOM
• How large DOM sizes affect interactivity, and what you can do about it
• The truth about CSS selector performance
Ответы на вопросы
Ведущие: Юля Миоцен, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:31 Исходники WebKit
00:07:18 UI вместо AI
00:22:27 Baseline
00:42:53 INP в CWV
00:51:56 Linear в CSS
00:59:41 Kotlin и WASM
01:07:21 Цвета GitHub
01:14:15 JS как PHP
01:38:12 Ответы на вопросы
Исходники WebKit
• Contributing to WebKit
• Introducing WebKit Documentation
UI вместо AI
• 10 updates at Google I/O
• What’s new in CSS and UI: I/O 2023 Edition
Baseline
• Introducing Baseline
• Introducing Baseline: a unified view of stable web features
• Baseline features you can use today
INP в CWV
• Advancing Interaction to Next Paint
Linear в CSS
Kotlin и WASM
Цвета GitHub
• Unlocking inclusive design: how Primer’s color system is making
JS как PHP
• The JavaScript Ecosystem is Delightfully Weird
Ответы на вопросы
• Decap CMS
• Kirby CMS
• Tilda
• Webflow
• Readymag
• Squarespace
• Framer
• Bubble
Ведущие: Андрей Мелихов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:38 Safari TP 169
00:09:19 WebContainer в Safari
00:25:06 Ошибка в единицах QC
00:29:40 Chrome 113
00:40:58 Бета Chrome 114
00:58:06 SupportsCSS
01:10:29 Event Loop
01:15:37 Deno 1.33
01:24:41 Vercel Ship
01:35:02 Ответы на вопросы
Safari TP 169
• Release Notes for Safari Technology Preview 169
WebContainer в Safari
• WebContainers now run on Safari, iOS, and iPadOS
• TC39: Error Stacks
Ошибка в единицах QC
• CQ units use border box instead of a content box
• WebKit PR
Chrome 113
Бета Chrome 114
• Chrome 114 beta
• Blur camera background
• It seems like subgrid is starting to land in Chrome
SupportsCSS
• Testing Feature Support for Modern CSS
• SupportsCSS
Event Loop
• Practical Guide To Not Blocking The Event Loop
Deno 1.33
Vercel Ship
Ответы на вопросы
Ведущие: Андрей Мелихов, Вадим Макеев, Юля Миоцен, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:32 Инклюзивный ананас
00:04:38 Scroll animations
00:19:16 Badging API
00:29:16 Opera One
00:38:08 Scope в CSS
00:52:43 Дизайн-система WP
01:00:45 ES-модули
01:19:16 Ответы на вопросы
Инклюзивный ананас
Scroll animations
• Intent to Ship: Scroll-driven animations
• Scroll-driven Animations
Badging API
• Badging for Home Screen Web Apps
Opera One
Scope в CSS
Дизайн-система WP
• WP Design System: Accessibility
ES-модули
• ECMAScript modules and browser compatibility
Ответы на вопросы
Ведущие: Вадим Макеев, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:39 Safari TP
00:08:05 Chrome DevTools
00:14:55 Новинки ES2023
00:24:09 Экспорты в CSS-модулях
00:41:41 Письма без таблиц
01:05:13 HDR-градиенты
01:14:03 Node.js 20
01:21:45 Зачем Deno?
01:34:55 Ответы на вопросы
Safari TP
• Release Notes for Safari Technology Preview 168
Chrome DevTools
• What’s New in DevTools (Chrome 113)
Новинки ES2023
• What’s new in ECMAScript 2023
Экспорты в CSS-модулях
• CSSWG Drafts: Multiple stylesheets per file
• Cascading Stylesheet Module scripts
Письма без таблиц
• Modern HTML email (tables no longer required)
• Email Markup Consortium
• Can I email…
• Punched card coding
HDR-градиенты
• CSS HD Gradients
• A modern CSS gradient and color picking tool
Node.js 20
Зачем Deno?
• Deno vs. Node: No One is Ready for the Move
Ответы на вопросы
• Придумал вариант применения @layer
• CSS and JavaScript as first-class citizens in Eleventy
• Свежий взгляд на Gulp: функции и ES-модули
Ведущие: Андрей Мелихов, Алексей Симоненко, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:39 Zoom уходит из CSS
00:07:57 Text-wrap: balance
00:17:24 Зачем Cascade Layers
00:30:05 Reading-order
00:44:07 Правило перфоманса
00:57:41 Тест-раннер в Node.js
01:11:57 WordPress в браузере
01:21:54 Нейронки в браузере
Zoom уходит из CSS
Text-wrap: balance
• CSS Text balancing with text-wrap: balance
• CSS text-wrap: balance
Зачем Cascade Layers
• What’s a Basic Use Case for Cascade Layers in CSS?
Reading-order
• Solving the CSS layout and source order disconnect
Правило перфоманса
• The Performance Golden Rule Revisited
Тест-раннер в Node.js
• Node.js: Move ESM loaders off-thread
• Trying Node.js Test Runner
WordPress в браузере
• Build in-browser WordPress experiences WASM
Нейронки в браузере
• Web Stable Diffusion
• Играем в Mortal Kombat с TensorFlow.js
• WebGPU: Implementation Status
Ответы на вопросы
Ведущие: Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:08 Chrome 112/113
00:18:49 Safari TP
00:25:37 Hr внутри select
00:31:41 Релизы Safari
00:48:25 Babel на ESM
00:52:05 История JSON
01:05:11 Веб на WASM
Chrome 112/113
• New in Chrome 112
• Chrome 113 beta
• LCP change in Chrome 112 to ignore low-entropy images
Safari TP
• Release Notes for Safari Technology Preview 167
Hr внутри select
• Allow hr to be used inside select as a separator
Релизы Safari
• Safari releases are development hell
Babel на ESM
• Super experimental ESM-based version Babel
История JSON
• JSON vs XML With Douglas Crockford
Веб на WASM
Ответы на вопросы
Ведущие: Юля Миоцен, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:01:16 25 лет Mozilla
00:12:33 Новинки Figma
00:25:39 Safari 16.4
00:49:20 Sass и CSS-нестинг
00:59:50 Новости React Labs
01:09:59 media scripting
01:16:00 Playwright UI
01:20:47 CSS Zen Garden жив!
25 лет Mozilla
• A quarter century of Mozilla
• XUL Layout is gone
Новинки Figma
Safari 16.4
• WebKit Features in Safari 16.4
• JavaScript import maps are now supported cross-browser
• Safari 16.5 Beta Release
Sass и CSS-нестинг
Новости React Labs
• React Labs: What We’ve Been Working On
@media scripting
• Intent to prototype and ship: Scripting media feature
• Media scripting demo
Playwright UI
• Playwright: Introducing UI Mode
CSS Zen Garden жив!
Ответы на вопросы
Ведущие: Алексей Симоненко, Юля Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:01:08 Safari TP 166
00:09:33 HTML-элемент search
00:23:05 Focus-visible
00:31:20 GitHub Copilot X
00:47:34 AI в дизайне
01:05:32 AI в разработке
01:23:39 Печать на CSS
01:33:23 Планы на Vite 5
01:36:07 Ответы на вопросы
Safari TP 166
• Release Notes for Safari TP 166
HTML-элемент search
Focus-visible
• When is focus-visible visible?
GitHub Copilot X
• GitHub Copilot X: The AI-powered dev experience
AI в дизайне
AI в разработке
• The End of Front-End Development
Печать на CSS
• Laying Out a Print Book With CSS
Планы на Vite 5
Ответы на вопросы
Ведущие: Андрей Мелихов, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:54 Firefox 111
00:13:45 Анимация display
00:21:03 TypeScript 5.x
00:34:40 Container Queries
00:49:37 Anchor Positioning
01:07:19 Electron 10 лет
01:15:49 React.dev
01:23:33 Ошибки на React
01:35:26 Ответы на вопросы
Вадим ищет работу
Firefox 111
Анимация display
• Intent to Ship: Transitions on specified discrete properties
• Dialog open close animation
TypeScript 5.x
• Announcing TypeScript 5.0
• TypeScript 5.1 Iteration Plan
Container Queries
• On Container Queries, Responsive Images, and JPEG-XL
Anchor Positioning
• Future CSS: Anchor Positioning
Electron 10 лет
React.dev
Ошибки на React
• 5 Mistakes I Made When Starting My First React Project
Ответы на вопросы
• Over 1000 feeds for web developers
• Фид подкаста на Гитхабе
Ведущие: Алексей Симоненко, Андрей Мелихов, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:02:10 Chrome 111
00:06:49 Бета Chrome 112
00:18:24 Safari TP
00:30:53 Chrome на iOS
00:38:33 Тригонометрия в CSS
00:46:48 CSS Nesting
01:00:20 Ускорение таблиц
01:12:30 Inert и доступность
01:22:00 TS 5.0 на ES-модулях
01:33:26 Ответы на вопросы
Chrome 111
Бета Chrome 112
Safari TP
• Release Notes for Safari Technology Preview 165
• Новый image-set как тег picture в CSS
Chrome на iOS
• Checking out and building Chromium for iOS
• Open Web Advocacy
• The F-Word
Тригонометрия в CSS
• Trigonometric functions in CSS
CSS Nesting
Ускорение таблиц
• Making Tanstack Table 1000x faster with a 1 line change
Inert и доступность
• Firefox: Intent to ship inert attribute
• WCAG: Клавиатура
TS 5.0 на ES-модулях
• TypeScript’s Migration to Modules
Ответы на вопросы
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко, Алексей Симоненко, Юля Миоцен
Темы
00:00:00 Интро
00:01:47 Text-wrap: balance
00:12:50 CSS anchor positioning
00:36:44 Зум в мобильном Chrome
00:46:45 Блистательная кнопка
00:52:02 Стандарты дискуссий
01:05:43 CSS-специфичность
01:16:55 Текстовая семантика
01:32:36 Дизайн-система Wise
01:39:51 Фронтенд без сборки
01:50:43 Ответы на вопросы
Text-wrap: balance
• Chrome Canary: text-wrap: balance in action
• Bugzilla: Implement CSS text-wrap: balance
• CSSWG: text-wrap: balance feedback
CSS anchor positioning
• Tether elements to each other with CSS anchor positioning
• Open UI CG meetings
Зум в мобильном Chrome
• You can set zoom level while maintaining layouts
Блистательная кнопка
Стандарты дискуссий
• Improving standards of behavior in standards discussions
CSS-специфичность
• (255,255,255) is the highest specificity
Текстовая семантика
• Representation of style
• Screen Readers support for text level HTML semantics
Дизайн-система Wise
Фронтенд без сборки
Ответы на вопросы
Ведущие: Никита Дубко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:16 Safari TP
00:07:47 Apple про PWA
00:17:46 Chrome Headless
00:25:50 Статьи и курсы
00:38:43 Генераторы статики
00:49:39 Фронтенд без сборки
00:59:10 TypeScript Reset
01:05:26 WYSIWYG для React
01:16:59 Vercel Cache API
01:27:26 Ответы на вопросы
Safari TP
• Release Notes for Safari TP 164
Apple про PWA
• Why Apple/Safari/WebKit folks don’t say Progressive Web App or PWA
Chrome Headless
• Chrome’s Headless mode gets an upgrade
Статьи и курсы
• Web.Dev: Learn HTML
• Web.Dev: Learn Privacy
• Last baseline alignment
Генераторы статики
• The JavaScript Site Generator Review
Фронтенд без сборки
• Writing Javascript without a build system
TypeScript Reset
WYSIWYG для React
Vercel Cache API
• Vercel Cache API: A progressive cache, integrated with Next.js
Ответы на вопросы
• ECMAScript spec proposal for ShadowRealm API
• Styles Directory
• MDN: Template
Ведущие: Андрей Мелихов, Алексей Симоненко, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:39 Firefox 110 и Container Queries
00:19:50 Chrome DevTools 110/111
00:33:48 Тюнинг шрифтов
00:43:47 PWA-релиз Safari 16.4
00:58:15 Нестинг и postcss-preset-env
01:14:46 CSS-вишлист
01:29:16 Ответы на вопросы
Firefox 110 и Contaier Queries
• Firefox 110 for developers
• Container queries land in stable browsers
Chrome DevTools 110/111
• What’s New In DevTools (Chrome 110)
• What’s New in DevTools (Chrome 111)
Тюнинг шрифтов
PWA-релиз Safari 16.4
• Web Push for Web Apps on iOS and iPadOS
• Meet Web Push
• Safari 16.4 Beta Release Notes
• Web Push on iOS and iPadOS 16.4 beta 1
• How many sentences are not valid for the mobile Safari
Нестинг и postcss-preset-env
• Upcoming changes to CSS Nesting
• CSS Nesting syntax is not like Sass
CSS-вишлист
• Дейв Руперт
• Эрик Мейер
• Ахмад Шадид
• Мануэль Матузович
• Йенс Майерт
Ответы на вопросы
• CSS-Tricks: front-end and front end
• Frontend Issue #1
• Веб-стандарты в Spotify
• Подкаст на Гитхабе
Ведущие: Андрей Мелихов, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:39 Chrome 110
00:09:03 Chrome Beta 111
00:22:33 Safari TP
00:30:31 Новости Safari
00:41:59 Ленивый CSS в Safari
00:49:45 Interop 2023
01:02:42 Stylelint 15
01:07:17 Eleventy 2
01:14:14 Deno и SSR
01:28:15 Ответы на вопросы
Chrome 110
Chrome Beta 111
• Chrome 111 beta
• First/Last Baseline
• Intent to Prototype: CSS :initial pseudo class
Safari TP
• Release Notes for Safari TP 163
Новости Safari
• ElementInternals and Form-Associated Custom Elements
• Allowing Web Share on Third-Party Sites
• Try out CSS Nesting today
• Mozilla, like Google, is looking ahead to the end of Apple’s WebKit rule
Ленивый CSS в Safari
• CSS lazy loading is kinda broken in Safari
• Conditionally adaptive CSS
Interop 2023
• Apple
• Bocoup
• Google
• Igalia
• Microsoft
• Mozilla
Stylelint 15
Eleventy 2
• Eleventy v2.0.0, The Stable Release
• CSS and JavaScript as first-class citizens in Eleventy
Deno и SSR
• The Future (and the Past) of the Web is Server Side Rendering
Ответы на вопросы
Ведущие: Алексей Симоненко, Юля Миоцен, Андрей Мелихов
Темы
00:00:00 Интро
00:02:41 Бета TypeScript 5
00:17:14 Зачем новые цвета
00:35:29 Что угодно в PiP
00:43:59 Будущее Create React App
01:00:49 AI заменит или поможет?
Почта Веб-стандартов
Бета TypeScript 5
• Announcing TypeScript 5.0 Beta
• Civet
Зачем новые цвета
• High Definition CSS Color Guide
• CSS color-mix()
Что угодно в PiP
• The future of Picture-in-Picture
Будущее Create React App
• Create React App: proposed way forward
AI заменит или поможет?
• Httpie
• Magician for Figma
• OpenAI ChatGPT
• GitHub Copilot
• Microsoft Teams Premium with OpenAI features
Ведущие: Вадим Макеев, Мария Просвирнина, Никита Дубко
Темы
00:00:00 Интро
00:01:24 Safari 16.3 и TP 162
00:24:14 Firefox и новые цвета
00:37:48 Подробности про буквицу
00:42:27 Core Web Vitals 2023
01:02:10 Справочник по SVG
01:07:42 Нормальный CSS-in-JS
Safari 16.3 и TP 162
• WebKit Features in Safari 16.3
• Release Notes for Safari TP 162
• Margin-trim
• Declarative Shadow DOM
• Цветовые функции в CSS
Firefox и новые цвета
• Implement lab() and lch() from CSS Color Module L4
• Upgrading colors to HD on the web
Подробности про буквицу
• Greater styling control over type with initial-letter
Core Web Vitals 2023
• Our top Core Web Vitals recommendations for 2023
Справочник по SVG
• SSSVG: An Interactive SVG Reference
• Про CSS
• SVG Filters
Нормальный CSS-in-JS
Ведущие: Никита Дубко, Вадим Макеев, Алексей Симоненко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:16 Firefox 109
00:20:23 CSS для печати
00:30:24 Возвращение Servo
00:44:00 Насколько ты Fugu?
00:52:30 CSS-перфоманс
01:06:27 Великий раздел
Firefox 109
• Firefox 109
• Firefox 109 for developers
• Adding tick marks
• Keyboard accessible datetime picker popup
CSS для печати
• Firefox, Intent to ship: CSS named pages
• Firefox собирается выкатить именованные страницы
Возвращение Servo
• Servo to Advance in 2023
• Igalia plans around Servo
• ACID2 here we come :D
• Acid Tests
Насколько ты Fugu?
CSS-перфоманс
• Using :is() in complex selectors selects more than you might initially think
• The truth about CSS selector performance
• CSS runtime performance
Великий раздел
Ведущие: Андрей Мелихов, Алексей Симоненко, Вадим Макеев, Юля Миоцен
Темы
00:00:00 Интро
00:02:02 Safari TP
00:10:42 Chrome 109
00:24:33 Бета Chrome 110
00:34:51 :has для диапазонов
00:39:24 Conditional CSS
00:44:31 State of JS
01:10:08 Призрак CoffeeScript
Перевод про OKLCH
• OKLCH в CSS: почему мы ушли от RGB и HSL
Safari TP
• Release Notes for Safari Technology Preview 161
Chrome 109
• New in Chrome 109
• New CSS Relative Units
• Igalia Brings MathML Back to Chromium
Бета Chrome 110
• Chrome 110 beta
• SQLite Wasm in the browser backed by the Origin Private File System
Has для диапазонов
• Sibling Scopes in CSS, thanks to :has()
Conditional CSS
• Conditional CSS
• Figma: Improvements to library updates
State of JS
• The State of JS 2022
• How To Build A Progressively Enhanced, Accessible, Filterable And Paginated List
Призрак CoffeeScript
Ведущие: Андрей Мелихов, Никита Дубко, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:16 React Concurrency
00:18:34 Мифы HTTP3
00:39:12 Сжатие картинок
00:48:10 SVG-фильтры
00:53:55 CSS visibility
00:58:11 Порядок чтения
01:12:27 Тригонометрия в CSS
React Concurrency
• React Concurrency, Explained
Мифы HTTP3
• HTTP/3 Prioritization Demystified
Сжатие картинок
• Compress An Image Before Upload With JavaScript
• OffscreenCanvas
SVG-фильтры
• How To Distort Text With SVG Filters
CSS visibility
• Obscure CSS: Restoring Visibility
Порядок чтения
• CSS Display Module L3: Display Order
• CSSWG: Method of opting into following the visual order
Тригонометрия в CSS
• An Intro to Trigonometric CSS Functions
• Change between square tilings with CSS variables
Ведущие: Юля Миоцен, Андрей Мелихов, Алексей Симоненко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:02 Подкаст
00:19:44 Вадим
00:27:50 HTML/CSS
00:43:20 Никита
00:51:07 Интероп
01:02:12 Юля
01:09:42 Дизайн
01:14:55 Андрей
01:29:42 JS/API
01:38:12 Лёша
01:45:44 Браузер Arc
01:54:47 Планы
Ссылки
• Смотреть на Ютубе
• Все новогодние выпуски
• Блог Вадима
• Подкаст LP
• Канал Никиты в Телеграме
• Канал Андрея в Телеграме
• Interop 2022–2023
• The most hearted CodPens of 2022
Ведущие: Алексей Симоненко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:26 Safari 16.2
00:09:43 Safari TP
00:26:20 CSS Masonry
00:32:03 Badging API
00:37:20 Firefox 108
00:42:56 Passkeys в Chrome
00:51:43 Слухи про Apple
01:13:16 CSS Nesting
Safari 16.2
• WebKit Features in Safari 16.2
• First/Last Baseline
Safari TP
• Release Notes for Safari Technology Preview 160
CSS Masonry
• WebKit has started implementing CSS Grid Masonry Layout
Badging API
• WebKit engine support for Badging API
Firefox 108
Passkeys в Chrome
• Introducing passkeys in Chrome
Слухи про Apple
• Apple is reportedly preparing to allow third-party app stores on the iPhone
• Apple Considering Dropping Requirement for iPhone Browsers to Use WebKit
CSS Nesting
• Help choose the syntax for CSS Nesting
• Help pick a syntax for CSS nesting
Ведущие: Вадим Макеев, Никита Дубко, Юля Миоцен
Темы
00:00:00 Интро
00:01:31 Chrome Prerender
00:21:37 Экономный Chrome
00:26:27 Chrome 10 лет спустя
00:37:41 Результаты State of CSS
00:51:37 Design Tools Survey
00:56:13 Из таблицы в Figma
01:10:27 Новинки npm
01:22:04 Мобильные и десктопы
Chrome Prerender
• Prerender pages in Chrome for instant page navigations
Экономный Chrome
• New Chrome features to save battery and make browsing smoother
Chrome 10 лет спустя
Результаты State of CSS
Design Tools Survey
Из таблицы в Figma
• Sync and trigger Figma Components, Variants & Props
Новинки npm
• New npm features for secure publishing and safe consumption
• Npm feedback discussions
Мобильные и десктопы
Ведущие: Никита Дубко, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:24 Safari TP 159
00:12:20 Firefox 107
00:21:34 Chrome 108
00:34:00 Бета Chrome 109
00:41:07 CSS- и JS-календари
00:45:51 HTML-календарь
00:53:35 Ускорение инструментов
01:04:24 CSS-фильтры и маски
01:13:56 Цвета в CSS
Safari TP 159
• Release Notes for Safari TP 159
• WebKit Standards Positions: @scope
Firefox 107
Chrome 108
• New in Chrome 108
• The large, small, and dynamic viewport units
Бета Chrome 109
• Chrome 109 beta
• CSS Text Module Level 4
• -ms-hyphenate-limit-chars
CSS- и JS-календари
• Advent of CSS
• Advent of JavaScript
HTML-календарь
• HTMHell Advent Calendar 2022
• How to transfigure wireframes into HTML
• You Don’t Need ARIA For That
• Using SRI to protect from malicious JS
Ускорение инструментов
• Speeding up the JavaScript ecosystem. One library at a time
CSS-фильтры и маски
• Experimenting with layering, filtering, and masking in CSS
Цвета в CSS
• Color Formats in CSS: hex, rgb, hsl, lab
• Тёмная сторона веба
• Does OKLCH make it easier to read and understand colors?
• CLI convert-to-oklch
Ведущие: Никита Дубко, Юля Миоцен, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:24 Firefox Nightly
00:09:16 Смешные таблицы
00:17:38 Шум на CSS
00:28:17 State of JS
00:34:57 Npm-пакеты
00:40:28 Isolated Web Apps
00:56:49 Картинки, флексы и CSS
01:07:03 Доступность с клавиатуры
01:16:10 Два волка и инпут
Firefox Nightly
• More improvements than can fit into this title
Смешные таблицы
• My favorite piece of code on GitHub belongs to the WebKit engine
Шум на CSS
• Making Static Noise From a Weird CSS Gradient Bug
• The Art Of SVG Filters And Why It Is Awesome
• Creating Patterns With SVG Filters
State of JS
Npm-пакеты
• How we lost our slick new npm package name (and then got it back)
Isolated Web Apps
• Isolated Web Apps
• Learning from the mistakes of Firefox OS
Картинки, флексы и CSS
• CSS for Developers
• Inline Magic Space
• An Interactive Guide to Flexbox in CSS
Доступность с клавиатуры
• Practical Accessibility
• HTML And CSS (Part 1)
• JavaScript (Part 2)
Два волка и инпут
Ведущие: Юля Миоцен, Никита Дубко
Темы
00:00:00 Интро
00:01:08 Safari TP 158
00:10:31 Группа WebDX
00:19:54 OKLCH в CSS
00:33:11 TypeScript 4.9
00:45:40 CSS-токены на типах
00:56:03 Гриды и шейпы
01:04:17 Where или is
01:10:13 Трюк с has
Safari TP 158
• Release Notes for Safari TP 158
Группа WebDX
• WebDX: Improving the experience for web developers
OKLCH в CSS
• OKLCH in CSS: why we moved from RGB and HSL
TypeScript 4.9
CSS-токены на типах
• CSS-Only Type Grinding: Casting Tokens into Useful Values
Гриды и шейпы
• CSS Grid and Custom Shapes, Part 1
• CSS Grid and Custom Shapes, Part 2
• CSS Grid and Custom Shapes, Part 3
Where или is
Трюк с has
• Style a parent element based on its number of children using CSS
Ведущие: Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:39 18 лет Firefox
00:12:41 Safari TP 157
00:19:14 Next.js вместо CRA
00:30:13 JS и SEO
00:39:12 Rome 10
00:47:23 Пиксели или ремы
00:57:44 Код по папкам
01:06:14 Вёрстка баннера
18 лет Firefox
• 18 years ago today, we shipped Firefox 1.0
Safari TP 157
• Release Notes for Safari Technology Preview 157
Next.js вместо CRA
• Next.js passed Create React App in npm downloads
JS и SEO
• Google Needs 9X More Time To Crawl JS Than HTML
• Google: Dynamic Rendering Is A Workaround and Not A Long-Term Solution
Rome 10
• Announcing Rome v10
• Why Not Bundle with esbuild?
Пиксели или ремы
• Accessibility: px or rem?
• Ремы, емы, и почему отказ от них — не проблема
Код по папкам
• Feature-Sliced Design: эволюция фронтенда для быстрых экспериментов
• React File Structure
• Feature-Sliced Design
• Как разложить код по папкам, Александр Бальцевич
Вёрстка баннера
Ведущие: Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:32 Firefox 106
00:07:14 Снова Arc
00:28:14 Text Fragments
00:32:45 Зачем JPEG XL
00:42:44 Веб-шрифты
00:50:38 Цена jQuery
00:54:52 Vite vs Turbopack
01:03:26 Remix в Shopify
01:08:49 Исход из Твитера
Firefox 106
Снова Arc
• Time to reinvent the browser
Text Fragments
Зачем JPEG XL
• The Case for JPEG XL
• AVIF has landed
• Can I use: JPEG XL
Веб-шрифты
• Switching from static to variable fonts
• Using variable fonts on the web
Цена jQuery
• The impact of removing jQuery on our web performance
Vite vs Turbopack
• Is Turbopack really 10x Faster than Vite?
Remix в Shopify
• Mixing It Up: Remix Joins Shopify to Push the Web Forward
Исход из Твитера
• Your account is permanently suspended
• Accessibility Experience Team at Twitter is fired
• Fedifinder
• Канал Вадима в Телеграме
• Канал Никиты в Телеграме
Ведущие: Никита Дубко, Андрей Мелихов, Юля Миоцен
Темы
00:00:00 Интро
00:01:24 Safari 16.1
00:22:01 Chrome 107
00:30:29 Бета Chrome 108
00:39:51 Что не так с Next.js 13
00:55:05 Новый конфиг ESLint
01:03:52 Мэш-градиенты
01:10:26 Как работает блендинг
01:18:45 Опрос про дизайн
01:23:35 YouTube стал быстрее
Safari 16.1
• WebKit Features in Safari 16.1
• Responsively plugin for Figma
Chrome 107
Бета Chrome 108
• Chrome 108 beta
• The Large, Small, and Dynamic Viewports
Что не так с Next.js 13
• Next.js 13
• Automatic fetch() Request Deduping
• React + Next?
• Introducing Turbopack
• Evan You: Vite vs Next.js
Новый конфиг ESLint
• ESLint’s new config system, pt. 1
• ESLint Configuration Files (New)
Мэш-градиенты
• Highly Customizable Background Gradients
Как работает блендинг
• Blending Modes, тред
• Blending Modes, статья
Опрос про дизайн
YouTube стал быстрее
Ведущие: Андрей Мелихов, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:24 Дока про доступность
00:03:25 Safari TP 156
00:17:52 Interop 2022
00:29:20 DOM timers
00:36:51 CSS Speech
00:55:31 TypeRunner
01:06:06 CSS Toggles
01:20:43 Плохой CSS-in-JS
Дока про доступность
Safari TP 156
• Release Notes for Safari Technology Preview 156
• Control the behavior of JavaScript imports with Import Maps
• The wait is over: DuckDuckGo for Mac beta is now open to the public!
Interop 2022
• Browser Vendors Aim to Heal Developer Pain with Interop 2022
DOM timers
• Intent to Ship: Align Timers (including DOM timers) at 125 Hz
CSS Speech
• Why we need CSS Speech
• Speech Synthesis Markup Language
• CSS Speech Module
TypeRunner
• TypeRunner: High-performance TypeScript compiler
CSS Toggles
• CSS Toggles Explainer & Proposal
• CSS Toggles
• Chrome 108+ has experimental support for CSS Toggles
Плохой CSS-in-JS
• Why We’re Breaking Up with CSS-in-JS
• Reverted to using vanilla CSS too
Ведущие: Андрей Мелихов, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:23 Fleet для всех
00:15:54 Chrometober
00:24:13 Fugu не всё
00:35:48 Полезные паттерны
00:42:29 Курс WebPageTest
00:50:45 SVG-спрайты
01:01:51 Два разных JS
01:14:29 Socket
Fleet для всех
• Introducing the Fleet Public Preview
Chrometober
• Chrometober 2022
• Scroll-timeline Polyfill
Fugu не всё
Полезные паттерны
• New patterns for amazing apps
• GoogleChrome/web.dev/…/patterns
Курс WebPageTest
• Lightning-Fast Web Performance Online Course,
SVG-спрайты
• SVG sprites: old-school, modern, unknown, and forgotten
Два разных JS
Socket
• Node on mobile, NodeConf EU 2022
• Socket — A New Runtime for the Web
• Socket SDK
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко
Темы
00:00:00 Интро
00:01:08 Safari TP
00:06:44 State of CSS
00:11:50 Intl API
00:16:34 Axios 1.0
00:22:10 Пикер эмоджи
00:27:59 CSS Nesting
00:43:41 JS в C++
00:53:30 PWA-плеер
01:11:10 Быстрые тесты
01:24:16 10 лет TypeScript
Safari TP
• Release Notes for Safari TP 155
State of CSS
• State of CSS 2022
• Devographics
Intl API
• Intl.NumberFormat.format() Playground
Axios 1.0
Пикер эмоджи
• Proposal: showEmojiPicker() on input/textarea
CSS Nesting
• Simplified CSS nesting syntax
• Sass-вермишель
JS в C++
• I turned JS into a compiled language (for fun and Wasm)
PWA-плеер
• Building desktop apps without native code
• PWAs on Chrome
• Project Fugu. Is it edible?
Быстрые тесты
10 лет TypeScript
• Ten Years of TypeScript
• Microsoft’s Typescript is SO impressive (2012)
Ведущие: Никита Дубко, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:16 Chrome 106
00:13:20 Бета Chrome 107
00:20:36 Firefox 105
00:33:45 Facebook WebView
00:44:25 Learn HTML/a11y
00:50:31 SVG на CSS
00:59:33 Prettier
01:12:52 Веб-альманах CSS
01:27:23 Веб-альманах JS
01:34:23 Веб-альманах HTML
Chrome 106
Бета Chrome 107
Firefox 105
Facebook WebView
• Launching a new Chromium-based WebView for Android
Learn HTML/a11y
• Learn HTML
• Learn Accessibility
SVG на CSS
• Experimenting A New Syntax To Write SVG
Prettier
• Why I don’t use Prettier
• No need to argue anymore!
Веб-альманах
• Web Almanac 2022
• Google Fonts on Twitter
• Тред Стефана Джадиса
Ведущие: Андрей Мелихов, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:47 Safari TP
00:10:39 Interop 2023
00:29:33 Грязная конкуренция браузеров
00:43:36 Node.js вместо bash
00:52:02 HTML быстрее SPA
01:06:06 Грид-области
01:17:14 Сложные отношения с React
Safari TP
• Release Notes for Safari TP 154
Interop 2023
• Submit your proposals for Interop 2023
• HTTP 203 Viewport
• HTTP 203 Podcast
• Interop 2023: Focus Area Proposal
Грязная конкуренция браузеров
Node.js вместо bash
• Shell scripting with Node.js
• A tool for writing better scripts: zx
• How to Write Shell Scripts in Node with Google’s zx Library
HTML быстрее SPA
• Will Serving Real HTML Content Make A Website Faster? Let’s Experiment!
Грид-области
• Using Grid Named Areas to Visualize (and Reference) Your Layout
Сложные отношения с React
• React I Love You, But You’re Bringing Me Down
• Introducing Signals
Ведущие: Юля Миоцен, Андрей Мелихов
Темы
00:00:00 Интро
00:01:08 Safari 16
00:12:39 Has сломал jQuery
00:23:41 Adobe Figma CC
00:35:25 Плохой input number
00:45:53 JS и loading=lazy
00:49:58 Медленный SSR
00:58:55 Theatre.js
Safari 16
• WebKit Features in Safari 16.0
• Is animated AVIF support already landed?
• Safari 16.1 Beta Release Notes
• Container queries begin to land in stable browsers
Has сломал jQuery
Adobe Figma CC
• Слух года: Adobe собирается купить Figma
• A new collaboration with Adobe
Плохой input number
• Why the number input is the worst input
• Why the GOV.UK Design System team changed the input type for numbers
JS и loading=lazy
• Disabled JavaScript turns off native lazy loading
Медленный SSR
• How To Avoid SSR Load Issues in Node.js
Theatre.js
Ведущие: Вадим Макеев, Юля Миоцен, Никита Дубко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:08 Firefox Nightly
00:08:06 Safari TP
00:28:25 Браузер Arc
00:36:23 Сбор SVG-багов
00:41:41 Доступность в Доке
00:50:00 Вложенный радиус
00:57:33 Правильное меню
01:12:53 Доступ к камере из HTML
01:25:38 Clipboard API
01:28:36 Export default
Firefox Nightly
• These Weeks In Firefox: Issue 123
Safari TP
• Release Notes for Safari Technology Preview 153
Браузер Arc
• Arc
Сбор SVG-багов
Доступность в Доке
• Дока
• Раздел по доступности в Доке
• Ишью с лейблом a11y
Вложенный радиус
• New border-radius value for perfectly matching nested radii
• Optical correction for rounded corners
Правильное меню
• Building the main navigation for a website
• Stylelint-performance-animation
Доступ к камере из HTML
• You Can Access A User’s Camera with Just HTML
Clipboard API
Export default
Ведущие: Андрей Мелихов, Вадим Макеев, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:04:14 Chrome 105
00:24:01 Картинки в Angular
00:31:10 Firefox 104
00:44:04 Новинки SpiderMonkey
00:56:30 Бета TypeScript 4.9
01:04:03 Стилизация ошибок
01:14:20 Отключение кук
Chrome 105
Картинки в Angular
• Optimizing Images with the Angular Image Directive
Firefox 104
• Firefox 104
• Oh Snap! Adam Argyle
• Титры для Disney+
• Титры для Washington Post
• WebVTT API
• Файл youtube.js
Новинки SpiderMonkey
• SpiderMonkey Newsletter (Firefox 104-105)
• No more confusing native modules in Node.js
Бета TypeScript 4.9
• TypeScript 4.9 Iteration Plan
Стилизация ошибок
• Meet the CSS highlight pseudos
• Chromium spelling and grammar features
• Chromium spelling and grammar, part 2
• Styles of text selection
Отключение кук
Ведущие: Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:10 Safari TP 152
00:07:19 Селектор :has
00:27:03 Flipper для отладки
00:37:37 Deno теперь с npm
00:46:33 Console Ninja
00:51:50 Цвета и контраст
01:01:48 Перфоманс и Early Hints
01:20:16 Должен ли фронтендер
Safari TP 152
• Release Notes for Safari Technology Preview 152
Селектор :has
• Using :has() as a CSS Parent Selector and much more
Flipper для отладки
• Flipper and JS: why we added JS support to a mobile debugging platform
• Flipper
Deno теперь с npm
Console Ninja
Цвета и контраст
Перфоманс и Early Hints
• How to eliminate render blocking resources
• Early Hints update: How Cloudflare, Google, and Shopify are working together to build a faster Internet for everyone
• Faster page loads using server think-time with Early Hints
Должен ли фронтендер
Ведущие: Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:07 Server Push всё
00:09:04 Chrome DevTools
00:26:42 Перфоманс
00:39:24 SPA и SEO
00:50:55 FocusVisible
01:00:58 Приватность WebView
01:13:21 Container Queries
Server Push всё
• Removing HTTP/2 Server Push from Chrome
Chrome DevTools
• What’s New In DevTools (Chrome 105)
Перфоманс
• Can browsers optimize the loading of third-party resources?
SPA и SEO
• Google: Dynamic dendering is a workaround and not a long-term solution
FocusVisible
• The HTML has added a focusVisible option for the focus()
• This :focus-visible to :focus fallback is good enough for Safari 14
Приватность WebView
• iOS Privacy: see what JS commands get injected through an in-app browser
Container Queries
• Use the Right Container Query Syntax
• Container-query-polyfill
• A first look at container-query-polyfill
• CSS Container Queries, или Адаптация по-новому
Ведущие: Андрей Мелихов, Юля Миоцен
Темы
00:00:00 Интро
00:00:53 Эмоджи в опенсорсе
00:04:06 Чёрно-белые интерфейсы
00:10:25 TypeScript 4.8 RC
00:13:15 Смешивание цветов
00:20:45 Единицы вьюпорта
00:29:26 Неожиданный рейтинг
00:33:30 Анимация в DevTools
00:41:21 React Query, не зашло
00:51:01 Аннотация типов в JS
Эмоджи в опенсорсе
• Open-source Microsoft Teams emojis
Чёрно-белые интерфейсы
• System.css
• Mono
TypeScript 4.8 RC
• Announcing TypeScript 4.8 RC
Смешивание цветов
Единицы вьюпорта
Неожиданный рейтинг
Анимация в DevTools
React Query, не зашло
• Why we moved away from React Query
Аннотация типов в JS
Ведущие: Никита Дубко, Юля Миоцен, Андрей Мелихов, Алексей Симоненко
Темы
00:00:00 Интро
00:00:46 Chrome DevTools
00:16:12 @container и :has
00:25:17 Random в CSS
00:33:16 CSS в npm
00:43:02 Docusaurus
00:49:44 Стики VS Code
00:57:51 Поля для телефона
01:11:45 Отдельные transform
01:16:15 SPA и MPA
Chrome DevTools
• What’s New In DevTools Chrome 104
• BFCache, или Туда и обратно
• C in 100 Seconds
@container и :has
• @container and :has() landing in Chromium 105
• 2D hover effect using :has()
Random в CSS
• Random() function
• We just resolved to pursue work on random() and random-item() for CSS!
CSS в npm
• Npm Query
• Introducing the new npm Dependency Selector Syntax
• Npm ships a new query command to inspect dependencies
Docusaurus
Стики VS Code
• VS Code comes with an experimental sticky mode
Поля для телефона
• Phone inputs and you: the designer’s essential UI guide
Отдельные transform
• Finer grained control over CSS transforms with individual transform properties
SPA и MPA
• In Defence of the Single Page Application
• The balance has shifted away from SPAs
• SPAs: theory versus practice
Ведущие: Андрей Мелихов, Алексей Симоненко, Никита Дубко
Темы
00:00:00 Интро
00:00:52 State of CSS
00:11:50 CSS Nesting
00:28:07 Firefox 103
00:37:46 Безопасность npm
00:48:41 Адаптивный манифест
01:00:38 SVG не только картинка
01:08:23 Лоадеры в Node.js
01:15:59 CSS-селекторы будущего
01:23:27 Сторонние куки
State of CSS
• Help design the State of CSS Survey 2022!
CSS Nesting
• Help pick a syntax for CSS nesting
Firefox 103
• Firefox 103 (En)
• Firefox 103 (Ru)
Безопасность npm
• Introducing even more security enhancements to npm
Адаптивный манифест
SVG не только картинка
• SVG images aren’t just images
• Svg-hush
Лоадеры в Node.js
• Experimental ESM Loader
• Experimental ESM Loader Hooks API
CSS-селекторы будущего
• Solving “The Dangler” Conundrum with Container Queries and :has()
Сторонние куки
• New Recipes for “Cookies”
• Expanding testing for the Privacy Sandbox for the Web
Ведущие: Алексей Симоненко, Вадим Макеев, Юля Миоцен
Темы
00:00:00 Интро
00:00:44 Twitter Spaces
00:09:43 Safari 15.6
00:16:50 Новые люди в Apple
00:28:38 Графика или CSS?
00:39:24 ARIA в CSS-селекторах
00:49:34 Эмоции в интерфейсах
01:06:30 Курс по доступности
Twitter Spaces
• Connect with us on Twitter Spaces
Safari 15.6
• New WebKit Features in Safari 15.6
Новые люди в Apple
• I have joined the WebKit team at Apple
Графика или CSS?
• Yes, it’s a CSS
• Тайна третьей планеты
ARIA в CSS-селекторах
• Style with Stateful, Semantic Selectors
Эмоции в интерфейсах
• Where’s the fun in accessibility?
Курс по доступности
• Testing Accessibility
• Thrilled to announce my self-paced a11y workshop series
Ведущие: Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:00:34 Chrome Dev Insider
00:19:52 Safari TP
00:27:24 Библиотека React-компонентов
00:47:32 Кнопки, но не радио
00:56:30 Переменные единицы
01:10:01 Aspect-ratio
Chrome Dev Insider
• Chrome Dev Insider: The CSS and UI edition
Safari TP
• Safari Technology Preview 149
Библиотека React-компонентов
• Notes on maintaining an internal React component library
Кнопки, но не радио
• What is the best way to mark up an exclusive button group?
• Perceived affordances and the functionality mismatch
• Переключатель цветовой схемы
Переменные единицы
• Как и зачем типизировать CSS-переменные?
• Вы уже слышали о вариативных юнитах?
• Обсуждение термина variable units в словаре
Aspect-ratio
• Avoiding img layout shifts: aspect-ratio vs width & height attributes
Ведущие: Юля Миоцен, Андрей Мелихов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:48 Дизайн-токены
00:05:21 Bun.sh вместо Node.js
00:22:02 ES-модули в Node.js
00:33:48 Виджеты для Figma
00:40:31 OpenProps
00:45:33 Стиль кода MDN
00:59:17 Style Queries
01:09:38 Вариативные шрифты
Дизайн-токены
• Design Tokens CLI
• Design Systems News
• The Future of Design Tokens, вебинар 19 июля
Bun.sh вместо Node.js
• Bun.sh
ES-модули в Node.js
• Create a statement about migration to ESM
• Валентин Семирульник про ESM
• Роман Дворнов про ESM в Node.js
Виджеты для Figma
• Use plugins in files
• Виджет для GitHub
• Notion 2.17, now with Synced Databases
OpenProps
Стиль кода MDN
• Modernization of code examples
• Раздел JavaScript на Доке
Style Queries
Вариативные шрифты
Ведущие: Алексей Симоненко, Юля Миоцен, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:39 Safari TP
00:15:04 WebKit на GitHub
00:25:09 Model для 3D
00:33:17 Firefox 102
00:46:40 Браузеры
00:56:25 Интервенции
01:02:18 DevTools
01:11:08 HTML без фантазий
01:21:51 Color.js
Safari TP
• Release Notes for Safari Technology Preview 148
• Razvan Caliman
WebKit на GitHub
• And now WebKit is 100% on Git
• WebKit’s positions on emerging web specifications
• Support AVIF images for macOS Ventura and iOS 16
Model для 3D
• Model is a potential new HTML element
• Pointerevents в DevTools
Firefox 102
• Firefox 102 for developers
• Firefox 102
• Exploring the World of E-Ink
Браузеры
• New to the web platform in June
• Browsers.fyi
Интервенции
• What are browser interventions
DevTools
HTML без фантазий
• Replace current outline algorithm with one based on heading levels
Color.js
• Color.js
Ведущие: Андрей Мелихов, Алексей Симоненко, Юля Миоцен, Никита Дубко, Вадим Макеев
Темы
00:00:00 Интро
00:01:38 Chrome 103
00:09:57 Бета Chrome 104
00:26:45 Зачем :has
00:33:13 MathML в Chrome
00:43:09 Defensive CSS
00:49:54 Порядок фокуса
01:00:55 Карточка-ссылка
01:10:46 Дизайн-токены
01:16:03 Красивое
01:19:08 ES 2022
01:28:35 GitHub Copilot
Chrome 103
Бета Chrome 104
• Chrome 104 Beta: New Media Query Syntax, Region Capture, and More
• Focusgroup Explainer
Зачем :has
• :has() shipping with Chrome 105
MathML в Chrome
• Intent to Ship: MathML
• Achievement Unlocked: Intent to Mathify
Defensive CSS
Порядок фокуса
• Tab visual order vs logical order
Карточка-ссылка
• Простая семантичная карточка-ссылка
Дизайн-токены
Красивое
• Sharing some music with code
• Hydra
• Tidal Cycles
ES 2022
• ECMAScript excitement
• ECMAScript 2022: What’s new?
• TC39: взгляд изнутри, Сергей Рубанов
GitHub Copilot
Ведущие: Алексей Симоненко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:05:00 Понятные Media Queries
00:10:17 Релиз-ноуты V8 всё
00:14:37 Бета Safari 16
00:26:29 Container Queries
00:36:18 Telegram защитник веба
00:46:53 Мир без паролей
00:58:08 Что попросить у Safari
01:03:27 IE снова всё
Понятные Media Queries
• New syntax for range media queries in Chrome 104
Релиз-ноуты V8 всё
• Discontinuing V8 release blog posts
Бета Safari 16
• News from WWDC22: WebKit Features in Safari 16 Beta
• What’s new in Safari and WebKit
• Create Safari Web Inspector Extensions
• Meet Web Push for Safari
Container Queries
• CSS Container Queries, или Адаптация по-новому
• CSS Container Query Units
• Say Hello To CSS Container Queries
• CSS Container Queries For Designers
Telegram защитник веба
• Does Apple intentionally prevent Safari from being a modern browser?
Мир без паролей
• Apple Just Killed the Password—for Real This Time
Что попросить у Safari
• New CSS, fixed bugs
• JS or Web API
• Any new CSS magic
IE снова всё
• The future of Internet Explorer on Windows 10 is in Microsoft Edge
• Internet Explorer 11 desktop app retirement FAQ
• Today, the Trident Era Ends
• Internet Explorer Still Does Not Go Away Today
• What To Expect When You’re Expecting To Drop IE11
• Internet Explorer shutdown to cause Japan headaches “for months”
Ведущие: Андрей Мелихов, Мария Просвирнина, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:07 События
00:04:03 Новости Express
00:08:25 WebP в Photoshop
00:19:10 Чарты в маркдауне
00:25:00 Фултайм Eleventy
00:35:53 Забытый тег layer
00:43:33 Кривые Безье
00:49:27 React Native
00:56:11 State of JS
События
• MinskJS Meetup онлайн 2 марта
• Desilopers & Devigners онлайн 10 марта
• Шрифт в вебе без боли, Рома Шамин
• BeJS Conf в Брюсселе и онлайн 13 мая
Новости Express
WebP в Photoshop
• Adobe Photoshop: Native support for WebP
Чарты в маркдауне
• Include diagrams in your Markdown files with Mermaid
Фултайм Eleventy
• Full time open source development for eleventy, sponsored by netlify
• Doubling down on the ecosystem: open source and integrations
• Eleventy на YouTube
• 28% build time performance improvement for Google’s web.dev
Забытый тег layer
• Which of these is NOT a built-in HTML element?
• How do you define built-in HTML element such that layer is included?
• These are spec violations, spec doesn’t have this rule for layer
• Баг в Chromium
• Баг в WebKit
Кривые Безье
• Опенсорсная книга по кривым Безье
• The Beauty of Bézier Curves
• Generative Design: Visualize, Program, and Create with JavaScript in p5.js Book
React Native
• Deep dive into React Native’s New Architecture
State of JS
• The State of JS 2021
• JavaScript is in a tremendously better state today compared to 2016
• What’s New in the 2021 State of JavaScript Survey
• State of JavaScript 2021 Livestream
• Не успела Дока запуститься, а уже попала в State of JS
Ведущие: Полина Немчак, Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:02:51 События
00:07:21 Safari TP
00:13:11 Диалог в WebKit
00:21:42 Interop 2022
00:26:05 Атрибут popup
00:33:02 SQL в CSS
00:42:27 Жалобы на браузеры
00:55:23 Календарь ЯЛФ
01:07:25 Доклады ЯЛФ
Полина Немчак
• Полина в Твиттере
• Канал Полины в Телеграме
События
• Я Люблю Фронтенд 26 февраля
• Krasnodar Frontend miniConf в Краснодаре 23 апреля
• HolyJS онлайн 18–21 апреля
• Web Audio conference CFP открыто до 15 марта
Safari TP
• Safari Technology Preview 140
Диалог в WebKit
• Introducing the Dialog Element
Interop 2022
Атрибут popup
• Popup Top-Layer UI Functionality
• Today’s meeting was 🔥, OpenUI
• Попап вместо селекта
SQL в CSS
• Yes, I can connect to a DB in CSS
• 6+5 способов сделать две колонки
Жалобы на браузеры
• Before I go: When it comes to complaining about web browsers
Я Люблю Фронтенд
Ведущие: Андрей Мелихов, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:13 События
00:03:20 Браузер Wolvic
00:11:35 Бета Chrome 99
00:20:55 Npm и 2FA
00:26:55 Cooler в Figma
00:32:17 Декораторы в Babel
00:36:30 Fetch в Node.js
00:39:00 Абстрактная раскладка
00:45:33 Ничей Jest
00:52:24 Дизайн-система Nova
01:00:35 Редкие шрифты
События
• OpenIT в Гомеле 19 февраля
• Desilopers & Devigners онлайн 10 марта
Браузер Wolvic
• Wolvic
• Introducing Wolvic
• Update on Firefox Reality
• Enter: Wolvic
Бета Chrome 99
Npm и 2FA
• Top-100 npm package maintainers now require 2FA
Cooler в Figma
• Coolors for Figma is finally here!
• Sorted CSS Colors
Декораторы в Babel
• Babel 7.17.0: RegExp 'v' mode and 🥁 decorators!
Fetch в Node.js
• fetch() In Node.js Core: Why You Should Care
Абстрактная раскладка
• LYTS, Layout primitives for React
Ничей Jest
• Nobody at FB (Meta?) has worked on Jest for years at this point
Дизайн-система Nova
• Дизайн-система Сбербанк Онлайн
• Гайды для дизайн-системы
Редкие шрифты
• North American Syllabics fonts developed in collaboration with Indigenous communities
• Эпизод подкаста с Александрой Корольковой
Ведущие: Юля Миоцен, Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:09 События
00:04:14 Topics API
00:17:23 Новинки Figma
00:21:49 Дизайн руками
00:31:01 Бедный WebKit
00:45:30 Сложности WebAssembly
00:51:52 TS на Go
01:01:50 Пайпы в JS
События
• Запись MinskCSS Meetup #9
• DUMP в Екатеринбурге 27 мая
• CodeFest в Новосибирске 28–29 мая
Topics API
• Анонс
• Технологии
• Спека
• Google Chrome third-party cookies block delayed until 2023
Новинки Figma
• 32 little big updates
• По-русски
Дизайн руками
• Building UIs in Figma with hand movements
Бедный WebKit
• Safari TP 139
• Please DONATE NOW to the world’s richest company, to help feed their starving browser
• No, Apple Did Not Crowdfund :focus-visible in Safari
• Adventures in Collective Implementation
Сложности WebAssembly
• WebAssembly feature detection
TS на Go
• I’m porting tsc to Go
• Hacker News
Пайпы в JS
• A pipe operator for JavaScript: introduction and use cases
Ведущие: Андрей Мелихов, Никита Дубко, Юля Миоцен
Темы
00:00:00 Интро
00:00:52 Safari TP
00:07:04 Утечка в Safari
00:12:57 Сабгриды +1
00:19:50 Vue 3 близко
00:26:15 Оверрайды в npm
00:32:41 Border-image
00:41:53 Читать ли спеки
00:51:54 Старые браузеры
01:00:41 Как не писать TypeScript
01:13:16 Девшахта
Safari TP
• Release Notes for Safari Technology Preview 138
Утечка в Safari
• Exploiting IndexedDB API information leaks in Safari 15
Сабгриды +1
• Intent to Prototype: CSS Subgrid
Vue 3 близко
Оверрайды в npm
Border-image
• Тёмная сторона CSS: выходим за рамки и взрываем звезды с border-image и градиентами
Читать ли спеки
Старые браузеры
• The Optional Chaining Operator, “Modern” Browsers, and My Mom
Как не писать TypeScript
• TypeScript Features to Avoid
Девшахта
• Девшахта на Ютубе
• Девшахта на Медиуме
• Сайт Андрея
• Андрей в Твиттере
Ведущие: Никита Дубко, Андрей Мелихов, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:04 События
00:02:35 Firefox 96
00:12:31 Лисичка, не кашляй
00:18:16 State of JS
00:22:08 Утечка из опроса
00:27:12 Вариативные шрифты и Figma
00:35:37 CSS Tools
00:42:40 Топ CodePen
00:50:45 CSS-парсер на Rust
00:57:02 Eleventy 1.0
01:07:31 Metho?
События
• Конференция по цифровой доступности онлайн 18 января—8 февраля
• 18 января: Доступные фичи и где они обитают, Татьяна Фокина
• MinskCSS Meetup онлайн 26 января
Firefox 96
Лисичка, не кашляй
• Firefox has witnessed outages recently
• Yesterday, Firefox became unresponsive
State of JS
Утечка из опроса
• Disclosing a State of JavaScript/State of CSS Data Leak
Вариативные шрифты и Figma
• Figma is adding the support of variable fonts!
• Add Support for Variable Fonts
CSS Tools
• CSS Tools
• CSS DB
• PostCSS Preset Env
• How we migrated postcss-preset-env to a mono repo
Топ CodePen
• Top-100 most hearted on CodePen 2021
CSS-парсер на Rust
Eleventy 1.0
Metho?
Ведущие: Никита Дубко, Андрей Мелихов, Юля Миоцен, Вадим Макеев
Темы
00:00:00 Интро
00:01:50 События
00:04:31 Chrome 97
00:14:34 Chrome DevTools
00:25:35 Faker.js
00:38:17 Crypto Mozilla
00:49:41 Дизайн-токены
События
• React Talks Meetup в Киеве 18 января
• JSNation в Амстердаме 16 июня
• React Summit в Амстердаме 17 июня
Chrome 97
• Видео: New in Chrome 97
• Статья: New in Chrome 97
Chrome DevTools
• Новинки DevTools (Chrome 97)
Faker.js
• Just went to install Faker for my latest demo, and…
• GitHub-репозиторий Faker.js
• Marak Takes An Open Source Stand
• Mocha: Delete my code
Crypto Mozilla
• Было: Dabble in @dogecoin? HODLing some #Bitcoin & #Ethereum?
• Стало: We’ll pause the ability to donate cryptocurrency
• I founded Mozilla and I’m here to say
• I designed Gecko
• Washed Up
• My first impressions of web3
• Crypto: the good, the bad and the ugly
Дизайн-токены
• Design Tokens + Open UI
• Design Tokens Format Module
• Design Tokens W3C Community Group
Ведущие: Андрей Мелихов, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:18 Подкаст
00:18:04 Проекты
00:31:30 Фронтенд
00:46:27 JavaScript
00:55:23 Бэк и тулинг
01:04:47 Вопрос
01:15:47 Личное
Подкаст
• Смотрите этот эпизод на Ютубе
• Все новогодние выпуски
Проекты
• Чат в Телеграме
• Новости на английском
• Календарь
• Словарь
Фронтенд
JavaScript
• Announcing the Deno Company
• Seed Funding for Remix
• Turborepo is joining Vercel
• Vercel welcomes Rich Harris, creator of Svelte
Бэк и тулинг
• Introducing Zero-Bundle-Size React Server Components
• New Suspense SSR Architecture in React 18
• React 18 Usage in Next.js
• Remix
• Rust is the future of JS infrastructure
Вопрос
Личное
• Итоги года Андрея
• Итоги годы Никиты
• Англоязычный блог Никиты
Ведущие: Денис Ушаков, Андрей Мелихов, Вадим Макеев, Валентин Фондаратов
Темы
00:00:00 Интро
00:02:33 Safari TP 137
00:06:34 Линтер на C++
00:13:15 Адаптивность и паттерны
00:16:01 Create React App 5
00:18:25 NAPI и Rust
00:24:12 Глубокое копирование
00:27:41 Быстрый Rust
00:39:11 Юникодный бэкдор
00:45:35 Зачем Fleet
01:09:01 Новая платформа JB
Safari TP 137
• Release Notes for Safari TP 137
• Don’t say Safari is always last. Sometimes we are first
• :has в CSS — псевдокласс из будущего
Линтер на C++
• Faster, easier, friendlier: how quick-lint-js will take over ESLint
Адаптивность и паттерны
• Learn Responsive Design
• Learning Patterns
Create React App 5
• CRA 5.0
NAPI и Rust
• Announcing NAPI-RS v2
• Deep dive: Native module
Глубокое копирование
• Deep-copying in JavaScript using structuredClone
Быстрый Rust
• Rust is the future of JS infrastructure
• Ли Робинсон
• Developers would rather have a faster tool that’s harder to contribute to
• Fast software wins
Юникодный бэкдор
• The invisible JS backdoor
• VS Code: "editor.unicodeHighlight.ambiguousCharacters": false
• Panic Nova
• Zed: lightning-fast, collaborative code editor written in Rust
• Lapce: lightning-fast and powerful code editor written in Rust
Зачем Fleet
• Встречайте Fleet — новый инструмент JetBrains
• Подлодка про IDE и Fleet
Ведущие: Никита Дубко, Саша Шинкевич, Глаша Жур, Вадим Макеев
Темы
00:00:00 Интро
00:02:01 События
00:07:05 25 лет CSS
00:12:26 State of CSS 2021
00:24:02 Safari 15.2
00:28:28 Отладка утечек
00:38:23 Кастомный select
00:46:24 DOM и AOM
00:55:05 Итоги Compat 2021
00:59:32 Минское сообщество
События
• Трансляция с Yamal.Dev Conf
• MoscowCSS онлайн 21 декабря
• MinskCSS онлайн 26 января
25 лет CSS
State of CSS 2021
• State of CSS 2021
• Assembler CSS
Safari 15.2
Отладка утечек
• Debug memory leaks with the Microsoft Edge Detached Elements tool
Кастомный select
• Fully-stylable and accessible select
DOM и AOM
• Full accessibility tree in Chrome DevTools
Итоги Compat 2021
• Compat 2021 Holiday Update: presents for developers before the end of the year
Ведущие: Андрей Мелихов, Вадим Макеев, Роман Байталов, Никита Дубко
Темы
00:00:00 Интро
00:01:00 События
00:02:10 Firefox 95
00:08:40 Safari TP 136
00:14:31 Web Neural Network API
00:19:15 Vercel + Turborepo
00:26:35 JetBrains в GitPod
00:34:10 Вшитые node_modules
00:49:18 Деплойми
События
• Я.Субботник по фронтенду и дизайну онлайн 11 декабря
• MoscowCSS онлайн 21 декабря
Firefox 95
Safari TP 136
• Release Notes for Safari Technology Preview 136
• Link to Text Fragment
Web Neural Network API
• Web Neural Network API
• Intent to Prototype: Web Machine Learning: Model Loader API
Vercel + Turborepo
• Vercel acquires Turborepo to accelerate build speed and improve developer experience
JetBrains в GitPod
• JetBrains desktop available in beta
Вшитые node_modules
• More teams should check node_modules directory into git
• Yarn Zero Installs
• Building layers. AWS Serverless Application Model
• Serverless TypeScript: A complete setup for AWS SAM Lambdas
Деплойми
• Deployme.app
• Heroku Buildpacks
• Роман Байталов: [email protected]
Ведущие: Андрей Мелихов, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:15 События
00:04:20 Лёгкий Fleet
00:16:48 Node.js в GitHub Actions
00:22:05 ESM+TS ломают сборку
00:29:28 Свежие Container Queries
00:33:16 Веб-альманах HTML
00:43:06 Веб-альманах CSS
00:48:59 Веб-альманах JS
26 лет JS
• The birth of JavaScript in 4 slides
• Netscape and Sun announce JavaScript (Dec 4, 1995)
События
• YaTalks онлайн 3–4 декабря
• Alfa JS MeetUP онлайн 9 декабря
• Odessa Frontend Meetup в Одессе 15 декабря
Лёгкий Fleet
• Встречайте Fleet — совершенно новый инструмент JetBrains
Node.js в GitHub Actions
• Default Node.js version will be set to 16 on November, 29
ESM+TS ломают сборку
• Chalk v5.0.0
• Pure ESM package
• Get Ready For ESM
Свежие Container Queries
• Existing CQ demos are broken in the latest Chrome Canary
Веб-альманах
• Markup
• CSS
• JavaScript
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:02:35 События
00:05:38 Полифил для Container Queries
00:13:44 Remix альтернатива Next.js
00:29:04 Состояние PWA в 2021
00:46:49 TypeScript в Etsy
00:54:49 Ресеты для CSS
Веб-стандарты на английском
События
• GDG Minsk Web онлайн 30 ноября
• YAMAL.DEV CONF в Салехарде 18 декабря
Полифил для Container Queries
• A polyfill for CSS Container Queries
• CSS: новый вид JavaScript
• CSS Container Queries, или Адаптация по-новому: контейнер вместо вьюпорта
Remix альтернатива Next.js
• Remix
• Introducing Remix v1
• 50-секундный питч Introducing Remix
• 6-часовой туториал Кента Доддса
• Introduction to Remix
Состояние PWA в 2021
TypeScript в Etsy
• Etsy’s Journey to TypeScript
• The essentials of TypeScript
Ресеты для CSS
• Modern CSS Reset / Global Styles
• HTML Шорты: Нормальный сброс
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко
Темы
00:00:00 Интро
00:00:54 События
00:03:05 Новинки Chrome 96
00:19:06 Что в бетах Chrome
00:23:56 Safari TP 135
00:29:14 Web Almanac
00:39:23 SVGcode
00:47:05 Сложный фронтенд
00:58:23 Прогресс-бар
01:01:40 Мифы о доступности
События
• Видео с ITeaConf
• WebCore Meetup онлайн 25 ноября
Новинки Chrome 96
• New in Chrome 96
• Intent to Prototype: blocking=render on scripts and link
• Explainer
• Resource Loading Orchestration
• Chrome 96 just enabled the back/forward cache
• BFCache, или Туда и обратно
• Google Chrome 96 breaks Twitter, Discord, video rendering and more
Что в бетах Chrome
• Chrome 97: WebTransport, New Array Static Methods and More
• Chromium commit: Support range syntax in MQ
Safari TP 135
• Release Notes for Safari TP 135
Web Almanac
• Web Almanac 2021
• Web Almanac Contributors
SVGcode
• SVGcode
• A PWA to convert raster images to SVG
Сложный фронтенд
Прогресс-бар
• Пишем семантически верные индикаторы загрузки на Angular
Мифы о доступности
Ведущие: Никита Дубко, Глеб Михеев, Вадим Макеев
Темы
00:00:00 Интро
00:02:52 События
00:07:38 HTML-элемент search
00:13:59 Парсеры HTML
00:21:39 Пути в кастомных свойствах
00:28:38 Contain и перфоманс
00:38:30 Дженерики в TypeScript
00:49:33 Angular 13
01:00:01 Агностичные компоненты
События
• Видео с Ad Blocker Dev Summit
• JavaScript Congress онлайн 23–25 ноября
• Скидка 20%: JSC-webstandardsru20
• JS fwdays онлайн 27 ноября
• Скидка 10%: EDE6EA6202
HTML-элемент search
Парсеры HTML
Пути в кастомных свойствах
• Пути в кастомных свойствах. История одного бага
Contain и перфоманс
• How I made Google’s data grid scroll 10x faster with one line of CSS
Дженерики в TypeScript
Angular 13
Ведущие: Андрей Мелихов, Сергей Бережной, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:58 События
00:10:36 Firefox 94
00:19:22 Chrome Dev Summit
00:27:32 Learn на Web.Dev
00:29:29 Next.js 12
00:33:06 Yarn 3.1
00:35:12 TypeScript 4.5 RC
00:36:57 Вёрстка чата
00:45:23 Взлом пакета
События
• Yandex Cup
• IT-конференция Merge в Иннополисе 13–14 ноября
• YaTalks 2021 онлайн 3–4 декабря
• React Conf 2021 онлайн 8 декабря
Firefox 94
• Firefox 94
• Firefox 94 for developers
Chrome Dev Summit
• Chrome Dev Summit
• CDS Recap
• The Privacy Sandbox
• Towards an animation smoothness metric
• An experimental responsiveness metric
• Tooling announcements
• Record, replay and measure user flows
Learn на Web.Dev
• Learn Responsive Design
• Learn Forms
• Learn PWA
Next.js 12
• Next.js 12
• Rakkas
Yarn 3.1
• Yarn 3.1: Corepack, ESM, pnpm, Optional Packages
TypeScript 4.5 RC
• TypeScript 4.5 RC
• Concerns with TypeScript 4.5’s Node 12+ ESM Support
Вёрстка чата
• Building Real-life Components: Facebook Messenger’s Chat Bubble
Взлом пакета
• Сегодня проснулся знаменитым
• Last release contains malicious code
• Command-Option-Argument
• Oclif: The Open CLI Framework
• Commander.js
Ведущие: Алексей Симоненко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:08 События
00:06:36 Большой Safari TP
00:14:11 Safari 15.1 и API
00:34:12 Photoshop в браузере
00:52:11 Node.js и веб-платформа
События
• Chrome Dev Summit
• HolyJS онлайн 2–5 ноября
• Видео с HolyJS Piter 2021
• WebCore Meetup онлайн 25 ноября
• YaTalks онлайн 3–4 декабря
• Видео с «Природы кода»
• Видео с NodeConf 2021
Большой Safari TP
• Release Notes for Safari TP 134
Safari 15.1 и API
• New WebKit Features in Safari 15
• Safari 15.1, bringing us 2017’s best graphics API: WebGL2
Photoshop в браузере
• Photoshop’s journey to the web
• We’re gated on a few WASM and File System Access APIs
Node.js и веб-платформа
• Node.js v16.13.0 LTS
• Node.js 16 promoted to long-term support
• Yes, Node.js is part of the Web Platform
Ведущие: Андрей Мелихов, Мария Просвирнина, Никита Дубко
Темы
00:00:00 Интро
00:00:52 События
00:03:37 Chrome 95
00:11:35 Экосистема 2021
00:23:57 VS Code в браузере
00:30:04 Node.js 17
00:35:19 Reporting API
00:42:09 Автозаполнение
00:51:13 SPA или MPA
События
• Next.js Conf
• Видео PWA Summit
Chrome 95
Экосистема 2021
• Состояние экосистемы разработки в 2021 году
VS Code в браузере
• Vscode.dev Visual Studio Code for the Web
Node.js 17
Reporting API
• Monitor your web application with the Reporting API
Автозаполнение
SPA или MPA
• Have Single-Page Apps Ruined the Web?
• Are SPAs better than MPAs? HTTP 203
Ведущие: Николай Лопин, Вадим Макеев, Алёна Батицкая
Темы
00:00:00 Интро
00:02:01 События
00:08:26 State of CSS
00:15:23 Палитры в Huetone
00:21:29 Яндекс.Браузер
00:30:17 Поле ввода пароля
00:37:52 Пугающий CSS будущего
00:48:22 Откуда взялась Дока
00:56:06 Взгляды на задачу
01:03:38 Сила опенсорса
01:12:33 Почему не MDN
События
• FrontendConf в Москве 11–12 октября
• Видео первого дня FrontendConf
• Видео второго дня FrontendConf
• DINS JavaScript Evening онлайн в Питере 21 октября
• Ad Blocker Dev Summit онлайн 21 октября
• devFest в Омске 23-24 октября
• Submit JS онлайн в Киеве 9 ноября
• ITeaConf онлайн в Воронеже 14 ноября
State of CSS
• State of CSS 2021
• Свежий опрос о разработке
Палитры в Huetone
• Huetone
Яндекс.Браузер
• Большое обновление Яндекс.Браузера
Поле ввода пароля
• The Options for Password Revealing Inputs
• Simple things are complicated: making a show password option
• Доступность и закон
Пугающий CSS будущего
• Conditional border-radius and three future CSS features
• CSS: новый вид JavaScript
Что такое Дока
Ведущие: Андрей Мелихов, Андрей Прокопюк, Никита Дубко
Темы
00:00:00 Интро
00:01:20 События
00:05:31 Firefox 93
00:18:24 Автоматическая тёмная тема
00:24:48 Баги браузеров
00:27:44 Бета TypeScript 4.5
00:40:26 Реальный перфоманс
00:55:20 Новый сайт в 2021
Андрей Прокопюк
• Андрей в Твиттере
• Сайт Андрея
События
• Видео с MoscowJS 50
• Видео с SECON.Weekend про фронтенд
• Видео с Я.Субботника Pro
• JSConf Armenia в Ереване 23 октября
• ITeaConf в Воронеже 31 октября
Firefox 93
• Firefox 93 for developers
• Firefox 93
Автоматическая тёмная тема
• Intent to Experiment: Auto Dark Mode & the CSS color-scheme “only” keyword
Баги браузеров
Бета TypeScript 4.5
• Announcing TypeScript 4.5 Beta
• Npm 8.0.0
• Node 16.11.0
Реальный перфоманс
• My Challenge to the Web Performance Community
Новый сайт в 2021
Ведущие: Андрей Мелихов, Саша Гришин, Никита Дубко, Лёша Тронов
Темы
00:00:00 Интро
00:00:55 События
00:07:56 Safari TP 133
00:16:19 Корневые сертификаты
00:21:35 Hacktoberfest
00:23:34 Rome на Rust
00:25:37 jQuery уходит
00:27:16 10 лет JS-лого
00:29:20 Cascade Layers
00:42:31 Пререндеринг
00:54:52 Финтех в Яндексе
События
• Видео с Я.Субботника по фронтенду 18 сентября
• SECON.Weekend в Пензе 2–3 октября
• FrontendConf в Москве 11–12 октября
• GraphQL Summit онлайн в Сан-Франциско 10–11 ноября
• JS Fwdays онлайн 27 ноября
• JS Fwdays CFP до 25 октября
Safari TP 133
• Release Notes for Safari Technology Preview 133
Корневые сертификаты
• Let’s Encrypt’s Root Certificate is expiring!
• Correct expired Let’s Encrypt certificate on EC2 instances
Hacktoberfest
Rome на Rust
• Rome will be written in Rust
jQuery уходит
• jQuery достиг пика популярности в 2020
10 лет JS-лого
Cascade Layers
• The Future of CSS: Cascade Layers (CSS @layer)
Пререндеринг
• Bringing instant page-loads to the browser through speculative prerendering
Финтех в Яндексе
Ведущие: Андрей Мелихов, Саша Беспоясов, Никита Дубко
Темы
00:00:00 Интро
00:01:36 События
00:05:24 Chrome 94
00:22:52 Safari 15
00:39:30 Порядок в голове
00:45:37 Чистая архитектура
Саша Беспоясов
События
• 404fest в Самаре 25–26 сентября
• EPAM Meet Up Mobile & Frontend онлайн 29 сентября
Chrome 94
• New in Chrome 94
• Новинки DevTools (Chrome 94)
Safari 15
• Safari 15 Release Notes
• Release Notes for Safari TP 132
Порядок в голове
• Getting Your head Straight: A New CSS Performance Diagnostics Snippet
Чистая архитектура
• Чистая архитектура во фронтенде
• Client-Side Architecture Basics [Guide]
• Does DDD Belong on the Frontend?
Ведущие: Алексей Симоненко, Андрей Мелихов, Вадим Макеев, Ольга Алексашенко, Мария Просвирнина, Никита Дубко
События
• Я.Субботник по разработке интерфейсов онлайн 18 сентября
Остальное
• Страница подкаста
• Подкаст Лёши про футбол
• Видеоблог Андрея
• Видеоблог Вадима
• Никита GDE
• Подкаст LP про музыку
• Подкаст Радио-Т
• Подкаст Подлодка
Ведущие: Андрей Мелихов, Иван Ботанов, Никита Дубко
Темы
00:00:00 Интро
00:01:26 События
00:06:38 Браузеры в iOS
00:15:02 TypeScript нужен не везде
00:25:06 Обучение через игру
00:32:14 Недоступный Open Graph
00:38:13 React Native в вебе
00:49:05 Сложный фронтенд
События
• X5Tech Природа Кода в Переславле-Залесском 11–12 сентября
• Odessa Frontend Meetup в Одессе 22 сентября
Браузеры в iOS
• Chrome is the new Safari. And so are Edge and Firefox
TypeScript нужен не везде
• Карго-культ TypeScript в украинских аутсорсерах
Обучение через игру
• Interactive learning tools for front-end developers
Недоступный Open Graph
• How to define Open Graph or Twitter image alt text
React Native в вебе
• Twitter’s div soup and uglyfied CSS, explained
Сложный фронтенд
Ведущие: Вадим Макеев, Сэм Булатов, Костя Подрубный, Никита Дубко
Темы
00:00:00 Интро
00:02:17 Элемент model
00:08:37 Chrome 93
00:26:23 Can I Include App
00:29:15 Нативный роутинг
00:36:55 Гайд по анимации
00:43:17 Дизайн-токены
00:55:22 RxJS
RndTechConf
• RndTechConf в Ростове-на-Дону 4 сентября
• Сэм в Твиттере
• Костя в Фейсбуке
• Сэм про шедулеры в RxJS на 404fest
• Костя про дизайн-токены на Frontend Conf
Элемент model
Chrome 93
Can I Include App
• Can Include
• Can Include для iOS
Нативный роутинг
• Modern client-side routing: the App History API
Гайд по анимации
Ведущие: Андрей Мелихов, Алексей Симоненко, Вадим Макеев
Темы
00:00:00 Интро
00:01:19 События
00:03:08 Бета Chrome 94
00:08:02 TypeScript 4.4
00:26:08 You don’t know JS
00:35:24 React render tracker
00:42:27 Особенности Safari
01:01:31 Текстовый браузер Deno
События
• RndTechConf в Ростове-на-Дону 4 сентября
• X5Tech Природа Кода в Переславле-Залесском 11–12 сентября
Бета Chrome 94
• Chrome 94 Beta: WebCodecs, WebGPU, Scheduling, and More
TypeScript 4.4
You don’t know JS
• You Don’t Know JS Yet second edition books
React render tracker
• Анонс в Телеграме
• Демо на Ютубе
Особенности Safari
• Why WebKit supports AVIF but Safari does not
• Новый image-set как тег picture в CSS
Текстовый браузер Deno
Ведущие: Андрей Мелихов, Дмитрий Королёв, Ольга Кобец, Никита Дубко
Темы
00:00:00 Интро
00:01:38 События
00:06:34 Safari TP
00:15:04 Учебник по ХТМЛ
00:27:42 SQL в браузере
00:35:38 ES-модули
00:43:06 AMP уже не тот
00:49:52 Сообщество MoscowJS
00:58:55 Конференция
01:07:23 Программа
События
• MoscowJS в Москве 11 сентября
• X5Tech Природа Кода в Переславле-Залесском 11–12 сентября
Safari TP
• Release Notes for Safari TP 130
• Safari 15: the bottom tab bar has been redesigned to appear below page content
Учебник по ХТМЛ
• ХТМЛ. Вёрстка для дизайнеров, редакторов и руководителей
SQL в браузере
ES-модули
• Modern web apps without JS bundling or transpiling
AMP уже не тот
• Resigning from the AMP advisory committee
MoscowJS
Ведущие: Андрей Мелихов, Вадим Макеев, Виталий Харисов, Никита Дубко
Темы
00:00:00 Интро
00:01:41 События
00:05:19 Firefox 91
00:13:27 GitHub Codespaces
00:27:22 Уже HTTP/3
00:42:39 Алертгейт
00:54:13 IE пошёл к бабуле
01:06:26 Чем мешает IE11
События
• GDG Minsk Web Meetup онлайн 24 августа
• Программа Women Developer Academy
• Форма регистрации на WDA
Firefox 91
• Hopping on Firefox 91
• Firefox 91
GitHub Codespaces
• Press . on any GitHub repo
• GitHub Codespaces и кодинг на iPad
• GitHub Codespaces: VS Code backend + VMs
• Codespaces is available for Teams and Enterprise Cloud
Уже HTTP/3
• HTTP/3 From A To Z: Core Concepts (Part 1)
• Head-of-Line Blocking в QUIC и HTTP/3: Подробности
Алертгейт
• Stay alert
• Foundations
• Breaking the web forward
• Choice Words about the upcoming deprecation of JS dialogs
IE пошёл к бабуле
• Встречайте бабушку
• What to expect when you’re expecting to drop IE
Ведущие: Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:00:48 События
00:04:59 Safari TP
00:08:04 WWW 30
00:14:58 System-ui
00:21:01 Предпочтения в заголовке
00:29:15 Parcel 2 RC
00:39:54 Super Duper без JIT
00:51:54 CSS-селекторы
00:58:51 Alt с эмоциями
События
• RndTechConf 4 сентября в Ростове-на-Дону
• 404fest 25–26 сентября в Самаре
• FrontendConf 11–12 октября в Москве
Safari TP
• Release Notes for Safari Technology Preview 129
WWW 30
• 30 years on from introducing the Web to the World
System-ui
• Firefox: add support for the system-ui generic font family
Предпочтения в заголовке
• User preference media features client hints headers
Parcel 2 RC
Super Duper без JIT
CSS-селекторы
• You want enabling CSS selectors, not disabling ones
Alt с эмоциями
Ведущие: Никита Дубко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:10 События
00:04:52 Chrome DevTools
00:12:55 Нестинг в CSS
00:28:15 Compat 2021
00:37:39 Yarn 3
00:49:29 Парсер URL
00:55:00 Git Hooks
01:16:07 Доступный диалог
События
• Должен ли дизайнер писать код? Юля Миоцен онлайн 5 августа
• Frontend Conference в Цюрихе 26–27 августа
• Vue.js London в Лондоне 20–21 октября
• HolyJS онлайн 2–5 ноября
Chrome DevTools
• What’s New In DevTools (Chrome 93)
Нестинг в CSS
• CSS Nesting Module
• CSS-нестинг — больше, чем сахар
Compat 2021
• Compat 2021 mid-year update: Flex gap everywhere
Yarn 3
• Yarn 3.0
• Yarn PnP, npm tink, and pnpm Oh My
• npm Blog Archive: Next Generation Package Management
Парсер URL
• URLPattern brings routing to the web platform
Git Hooks
• Git Hooks: let the machine do all the routine
Доступный диалог
Ведущие: Ольга Алексашенко, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:00:58 Safari TP 128
00:07:25 Стримы в Node.js
00:13:37 CDN не так хороши
00:26:00 Дизайн без сеток
00:40:31 Фейсбук на флоатах
00:48:52 Тестирование доступности
00:52:32 Спокойный интерфейс
00:58:42 Доступность section
Safari TP 128
• Release Notes for Safari TP 128
• Meta theme-color and trickery
Стримы в Node.js
• Node.js 16.5.0 - Experimental Web Streams API
• Все стандарты WHATWG
CDN не так хороши
• Akamai is experiencing a service disruption
• Remote code execution in cdnjs of Cloudflare
Дизайн без сеток
Фейсбук на флоатах
• Зачем делать копию Facebook под Internet Explorer 6 в 2021 году?
Тестирование доступности
• A Complete Guide To Accessibility Tooling
Спокойный интерфейс
• Как не навредить пользователям с эпилепсией и вестибулярными нарушениями
Доступность section
Ведущие: Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:01:06 События
00:08:11 Firefox 90
00:12:26 Новый image-set
00:16:19 Toggle в CSS
00:19:58 Доступность SPA
00:28:05 Export default
00:41:42 Lazy-loading
00:49:34 Библиотека Solid
События
• SberMarket Tech онлайн 22 июля
• Hot Frontend в Краснодаре 24 июля
• RamblerMeetup&Frontend онлайн 29 июля
• RndTechConf в Ростове-на-Дону 4 сентября
• 404fest X в Самаре 25–26 сентября
• FrontendConf в Москве 11–12 октября
Firefox 90
• Firefox 90
• Getting lively with Firefox 90
• Firefox, вздыхая: -webkit-image-set
Новый image-set
• Новый image-set как picture в CSS
Toggle в CSS
Доступность SPA
• Three Insights I Gained While Researching Vue.js Accessibility
Export default
• Export default thing is different to export { thing as default }
Lazy-loading
• The performance effects of too much lazy-loading
Библиотека Solid
Ведущие: Андрей Мелихов, Роман Шамин, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:03:33 Safari и WPT
00:11:03 PWA на десктопе
00:19:44 Petite Vue
00:32:17 Канон ВК
00:46:26 Npm audit сломан
00:57:01 Цветовые пространства
01:09:37 Марсианский гротеск
01:16:18 Шрифт для кода
Safari и WPT
• Logical shorthand + variable is unusable in Safari
PWA на десктопе
• Progressive Web Apps for Firefox
Petite Vue
• vuejs/petite-vue: 5kb subset of Vue
Канон ВК
• Публикуем «Канон» — библиотеку знаний дизайнеров ВКонтакте
• Тред про удалённую работу в Злых марсианах
Npm audit сломан
Цветовые пространства
• Using HSL Colors In CSS
• Цветовые пространства: большой разбор
• Тред про дизайн в sRGB
• Продолжение треда с Никитой Прокоповым
Марсианские шрифты
• Опрос про лигатуры в шрифтах
• Голосование «Современная кириллица 2021»
Ведущие: Никита Дубко, Вадим Макеев, Андрей Мелихов, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:56 События
00:02:12 Формат номеров
00:08:54 Safari TP 127
00:15:01 Theme-color
00:24:56 Accent-color
00:33:56 Temporal API
00:42:47 A11y для дизайнеров
00:55:25 Переезд на Material UI
События
• Podlodka Frontend Crew онлайн 12-13 июля
• Видео с FrontendMix в ЮMoney
Формат номеров
Safari TP 127
Theme-color
• Цветные вкладки на theme-color для Safari
Accent-color
• Change the form control color with accent-color property
Temporal API
• Temporal: getting started with JavaScript’s new date time API
A11y для дизайнеров
• Доступность в дизайне
• Color and contrast accessibility
Переезд на Material UI
• Material UI, или Как перестать волноваться и перейти на новую библиотеку компонентов
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:00:47 События
00:04:04 Chrome и сторонние куки
00:15:46 Safari TP (15)
00:22:13 Новинки ES2021
00:32:52 Promise.any и WeakRef
00:47:35 Веб-платформа
00:58:56 Таблицы и LayoutNG
01:05:54 Определение браузеров на CSS
События
• XTechnology Meetup онлайн 3 июля
• DevOps в AGIMA онлайн 6 июля
Chrome и сторонние куки
• An updated timeline for Privacy Sandbox milestones
• Privacy Sandbox
• Google Delays Cookie Removal to Late 2023
Safari TP (15)
• Release Notes for Safari TP 126 with Safari 15 Features
Новинки ES2021
• ES2021
• Weak references and finalizers
• ES2021: numeric separators
Веб-платформа
• Как организована веб-платформа
Таблицы и LayoutNG
• TablesNG Resolves 72 Chromium Bugs
Определение браузеров на CSS
• CSS @supports rules to target only Firefox, Safari, Chromium
Ведущие: Андрей Мелихов, Филипп Рябчун, Никита Дубко
Темы
00:00:00 Интро
00:01:04 События
00:03:27 Chrome ускоряет фреймворки
00:20:45 Astro и 11ty Serverless
00:27:04 Виртуальная клавиатура
00:35:46 JS для Nginx
00:47:37 Планы React 18
00:57:52 Зачем Suspense
01:11:07 TeamCity и YAML
События
Chrome ускоряет фреймворки
• Introducing Aurora
• Conformance for Frameworks
Astro и 11ty Serverless
• Introducing Astro:
• Eleventy Serverless (formerly Eleventy Cloud) Thus Far
Виртуальная клавиатура
JS для Nginx
• Магия вне Хогвартса: NJS
• Веб-сервер на Ubuntu 18 с нуля: nginx, HTTP/2, Brotli и HTTPS
Планы React 18 и Suspense
• The Plan for React 18
• New Suspense SSR Architecture in React 18
• Веб-стандарты 264 с Дэном Абрамовым
TeamCity и YAML
• TeamCity 2021.1: Kotlin and Node.js Build Runners
• Build Chains: TeamCity’s Blend of Pipelines
• Задача в трекере JetBrains про поддержку YAML
Ведущие: София Валитова, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:02:25 События
00:06:06 Бета Safari 15
00:19:14 Расширения Safari
00:26:08 Критика Safari
00:35:58 Mozilla и дэш-дэш
00:40:38 Блог без стилей
00:51:44 Ручной RSS
00:57:04 CSS в VK
01:04:21 Поиск стажёра
01:11:12 JSON для дизайнеров
София Валитова
• София в Твиттере
• Сайт Софии
• Патреон Софии
События
• X5 frontend meetup 1 июля в Москве
• MoscowJS 49
• PWA Summit онлайн 6–7 октября
Бета Safari 15
• Safari 15 Beta Release Notes
• WebKit Features in Safari at WWDC21
• Design for Safari 15
• Новый ключ user_preferences в веб-манифесте
• Meet Safari Web Extensions on iOS
• Develop advanced web content
Mozilla и дэш-дэш
• Make -- a reserved custom property name
Блог, CSS, RSS, VK
• Нативная валидация ввода в CSS
• Доклад «CSS глазами машин» Ромы Дворнова
• Доклад «Тег a» Никиты Дубко
• Доклад «CSS code coverage» Антона Холкина
Ведущие: Вадим Макеев, Андрей Мелихов, Али Рагимов, Никита Дубко
Темы
00:00:00 Интро
00:01:30 События
00:04:15 Бета Chrome 92
00:14:52 Новинки DevTools
00:31:15 Firefox 89
00:34:08 Якоря и расширения
00:41:41 Настройка CI в TeamCity
00:47:21 JS внутри WASM
00:57:55 TypeScript 4.3
01:13:48 Сомнения про TS
Али Рагимов
События
• OdessaFrontend в Одессе 16 июня
• Hot Frontend в Казани 17 июня
Бета Chrome 92
• Chrome 92: Web Apps as File Handlers, New JavaScript Features, and More
Новинки DevTools
• What’s New In DevTools (Chrome 92)
Firefox 89
Якоря и расширения
• CSS Anchored Positioning
• Forming the WebExtensions Community Group
Настройка CI в TeamCity
• TeamCity 2021.1: Kotlin and Node.js Build Runners
JS внутри WASM
• Making JavaScript run fast on WebAssembly
TypeScript 4.3
• Релиз TS 4.3! Посмотрим, что новенького он нам принёс
• Understanding TypeScript’s Popularity
• 10++ TypeScript Pro tips/patterns with (or without) React
• Starting a TypeScript Project in 2021
• Announcing TypeScript 4.3
• TypeScript: Раскладываем tsconfig по полочкам, часть 1
• TypeScript: Раскладываем tsconfig по полочкам, часть 2
Ведущие: Андрей Мелихов, Вадим Макеев, Илья Климов
Темы
00:00:00 Интро
00:02:02 События
00:09:06 Safari TP
00:10:40 Chrome 91
00:20:20 Node.js в браузере
00:31:38 Google Docs на Canvas
00:41:51 Flow почти всё
00:51:26 Зачем и как TDD
01:01:14 Babel на ESM
Промокоды
• 10% скидка на JS Fwdays: 28799A28A6
• 20% скидка на JavaScript.Ninja: Вебстандарты
• Патреон Веб-стандартов
События
• JavaScript fwdays онлайн 1–5 июня
• Илья Климов о работе простым программистом
• Goose & Duck, Дима Коваленко и Влад Шилов
Safari TP
• Safari Technology Preview 125
Chrome 91
• New in Chrome 91
• Sparkplug — a non-optimizing JavaScript compiler
• RSS in Chrome
Node.js в браузере
• Introducing WebContainers: Run Node.js natively in your browser
Google Docs на Canvas
• Google Docs will now use canvas based rendering: this may impact some Chrome extensions
Flow почти всё
• Clarity on Flow’s Direction and Open Source Engagement
• Продвижение опенсорс-проектов, Андрей Ситник
Зачем и как TDD
• TDD: зачем и как, доклад на Frontend Crew
Babel на ESM
Ведущие: Полина Гуртовая, Юля Миоцен, Вадим Макеев, Алёна Батицкая
Темы
00:00:00 Интро
00:02:10 События
00:07:19 Sublime Text 4
00:14:04 Совместимый Sass
00:17:09 Svelte после React
00:24:17 Container Queries
00:31:35 Learn CSS
00:41:00 Google I/O
00:53:14 Гибридные команды
01:02:29 Новые GDE
01:16:07 Зачем GDE
События
• Google I/O онлайн 18–20 мая
• DINS JavaScript Evening онлайн 26 мая
• CodeFest в Новосибирске 29–30 мая
• SECON в Пензе 19–20 июня
Sublime Text 4
Совместимый Sass
• We just released Sass 1.33.0
Svelte после React
• Svelte for the Experienced React Dev
Container Queries
• CSS Container Queries in Web Components
Learn CSS
• Learn CSS
• Learn CSS Base Styles
Google I/O
• Web at Google I/O 2021
• Chrome dev tools for designers
• The new responsive: Web design in a component-driven world
• What’s new in web platform
• Machine learning for next gen web apps with TensorFlow.js
• Performance after load
Google Developer Experts
Ведущие: Никита Дубко, Александра Шинкевич, Андрей Мелихов, Ольга Алексашенко
Темы
00:00:00 Интро
00:01:07 Компания Rome
00:05:38 CloudFront Functions
00:13:31 Кроссбраузерность
00:27:06 Can I has
00:31:45 Container Queries
00:39:03 Скроллер из будущего
00:44:27 Кастомные свойства
00:54:27 Мониторинг фронтенда
01:05:37 Александра и GDE
Компания Rome
CloudFront Functions
• Introducing CloudFront Functions
Кроссбраузерность
• The State of CSS Cross-Browser Development
Can I has
Container Queries
• A Primer On CSS Container Queries
• CSS Container Queries, или Адаптация по-новому
Скроллер из будущего
• Building a media scroller component
Кастомные свойства
• Practical Use Cases For CSS Variables
• CSS Battle
Мониторинг фронтенда
• Солидные фронтенды: мониторинг
Александра и GDE
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко, Владимир Гриненко
Темы
00:00:00 Интро
00:01:49 События
00:09:09 SpiderMonkey 25 лет
00:11:11 Safari TP 124
00:17:24 Bootstrap 5
00:28:38 Подарок от Гитхаба
00:31:42 Веб-компоненты в Гитхабе
00:39:00 Нужны ли ещё префиксы
00:51:46 Что за монорепы
00:59:07 Зачем монорепы
01:03:57 Взгляд пользователя
01:16:53 Свой git и Гитхаб
Владимир Гриненко
• Владимир в Твиттере
• Владимир в Телеграме
События
• A11y Club Minsk Meetup онлайн 14 мая
• DUMP в Екатеринбурге 14 мая
• Google I/O онлайн 18–20 мая
• Performance-testing the Google I/O site
• SimpleWebConf онлайн 24–25 мая
• CodeFest в Новосибирске 29–30 мая
SpiderMonkey 25 лет
Safari TP 124
• Release Notes for Safari Technology Preview 124
• Ускоряем WebGL/Three.js с помощью OffscreenCanvas и веб-воркеров
Bootstrap 5
Подарок от Гитхаба
• Sync from the parent repo with just a single click!
Веб-компоненты в Гитхабе
• How we use Web Components at GitHub
• Removing jQuery from GitHub.com frontend
Нужны ли ещё префиксы
Монорепы
• Доклад Владимира на CodeFest
• Разработка в монорепозитории
• Монорепозитории и где они обитают
Ведущие: Вадим Макеев, Андрей Мелихов, Никита Дубко, Сергей Сергеев
Темы
00:00:00 Интро
00:03:35 События
00:05:34 Safari 14.1
00:16:40 Гэпы во флексах
00:21:14 История JS
00:39:46 Мозаичный JS
00:54:18 Кому нужны алгоритмы
Сергей Сергеев
• Сергей в Твиттере
• Личный сайт
• Плейлист с докладами
События
• Semrush IT meetup онлайн 12 мая
• Ember.js Meetup в Нижнем Новгороде 14 мая
Safari 14.1
• iOS 14.5 brings the new Safari 14.1 to PWAs and the Web Platform
• New WebKit Features in Safari 14.1
Гэпы во флексах
• How to detect browser support for Flexbox Gap
История JS
• CSSSR История фронтенда. Выпуск 2
• История фронтенда: JavaScript как отражение новой эпохи
Мозаичный JS
• Как мы сделали JS по-настоящему модульным
Кому нужны алгоритмы
Ведущие: Вадим Макеев, Андрей Мелихов, Александр Мышов
Темы
00:00:00 Интро
00:10:42 Firefox 88
00:18:37 Node.js 16
00:26:45 Бета Chrome 91
00:35:58 XHR как дискета
00:39:19 Внезапный popup
00:48:54 AMP всё?
00:53:10 Core Web Vitals
Александр Мышов
• Defront в Телеграме
• Александр в Твиттере
• Defront на Патреоне
Firefox 88
• Never too late for Firefox 88
• Firefox 88
• ECMAScript Next compatibility table
Node.js 16
Бета Chrome 91
XHR как дискета
• Replace XHR with Fetch in DevTools
Внезапный popup
• Compatibility issue with existing popup use
• Awesome Standalones
AMP всё?
• More time, tools, and details on the page experience update
Core Web Vitals
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:13 Инди-сайты
00:05:54 Подкаст на сайте и RSS
00:11:13 Chrome 90
00:26:58 Инспектор гридов в Safari
00:30:28 Dart уходит из Wrike
00:44:40 FLoC или куки
01:00:44 Матрица компетенций
События
• Видео с Я.Субботника 17 апреля
• Холи 20-23 апреля
Инди-сайты
• Список инди-сайтов по фронтенду
Подкаст на сайте и RSS
Chrome 90
• Chrome 90
• We’ve rolled back the offline criteria for PWA
Инспектор гридов в Safari
• WebKit: Introducing CSS Grid Inspector
• Firefox 52
Dart уходит из Wrike
• Wrike уходит от использования языка Dart
FLoC или куки
• Why Brave Disables FLoC
• Nobody is flying to join Google’s FLoC
• How to take part in the FLoC origin trial
• FLoC vs 3rd party cookies
Матрица компетенций
Ведущие: Вадим Макеев, Никита Дубко, Мария Просвирнина, Александр Зубов
Темы
00:00:00 Интро
00:01:32 События
00:05:13 Возвращение SharedArrayBuffer
00:11:16 Base и стилизация контролов
00:17:30 DevTools на TypeScript
00:32:22 Индивеб и Dev Tips
00:42:30 Podlodka Frontend Crew
00:49:55 Будущее и воркшопы
00:55:20 Коммерция и сообщество
События
• CSS Conf Colombia онлайн 10 апреля
• Трансляция CSS Conf Colombia
• PiterJS онлайн 15 апреля
• Podlodka Frontend Crew онлайн 12–23 апреля
Возвращение SharedArrayBuffer
Base и стилизация контролов
• Appearance: base to enable interoperable styling
DevTools на TypeScript
• Migrating DevTools to TypeScript
Индивеб и Dev Tips
• Dev Tips
• Webmention.io
• Адвент-календарь постов про Индивеб
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов, Павел Минеев
Темы
00:00:00 Интро
00:01:13 События
00:04:11 Фиксы в Safari
00:07:47 Static в V8
00:13:29 Deno Company
00:21:35 Sublime Text 4
00:28:46 HSL и LCH
00:34:45 Медленная F1
00:42:04 Обратно на WordPress
00:54:48 Что такое SPA
01:07:11 Гидрация и Next.js
Павел Минеев
• Личный сайт
• Выпуск Радио-Т
• Remark42
События
• HolyJS онлайн 20–23 апреля
• Программа HolyJS на Хабре
• Frontend Crew онлайн 12–23 апреля
• CFP на 2 неделю
Фиксы в Safari
• Release Notes for Safari TP 123
• Compat 2021 Dashboard
Static в V8
• Class static initializer blocks
Deno Company
Sublime Text 4
HSL и LCH
• Dark mode in 5 minutes, with inverted lightness variables
Медленная F1
• Who has the fastest F1 website in 2021?
Обратно на WordPress
• Как я не перешёл с WordPress на Hugo, Gatsby и прочий Node
SPA, гидрация и Next.js
Ведущие: Вадим Макеев, Никита Дубко, Лена Райан, Марианна Минич
Темы
00:00:00 Интро
00:01:34 События
00:03:54 Новинки Firefox 87
00:07:12 Container Queries
00:12:34 Compat 2021
00:21:40 SvelteKit
00:31:07 Эмоджи или эмодзи
00:37:21 A11y-лонгрид
00:44:31 Дорога к доступности
События
• Theta Conf онлайн 10 апреля
• Я.Субботник онлайн 17 апреля
Новинки Firefox 87
Container Queries
• An experimental flag for container queries just hit Chrome Canary!
Compat 2021
• Compat2021: Eliminating five top compatibility pain points on the web
SvelteKit
Эмоджи или эмодзи
A11y-лонгрид
• A Complete Guide To Accessible Front-End Components
• Disabled buttons suck
Дорога к доступности
• Курс Валерии Курмак
• Блог Мануэля Матузовича
• Как незрячий пользуется iPhone, MacBook и Apple Watch
• Доклад Ивана Бакаидова на ЯЛФ
• Доклад Лены на IWD
• Доклад Саши Шинкевич про Bootstrap
• Доклад Ани Сафоновой на pitera11y_meetup
Ведущие: Вадим Макеев, Никита Дубко, Мария Просвирнина
Темы
00:00:00 Интро
00:00:42 События
00:04:10 Что нового в V8
00:09:39 Бета Chrome 90
00:32:43 Ненастоящие PWA
00:45:40 CSS Nesting
События
• International Women’s Day онлайн 20 марта
• MoscowJS онлайн 25 марта
Что нового в V8
Бета Chrome 90
• Chrome 90 Beta: AV1 Encoder for WebRTC, New Origin Trials, and More
• Explainer: Subresource loading with Web Bundles
Ненастоящие PWA
• Your PWA is going to break in August 2021
• Минимальное PWA
CSS Nesting
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:04 События
00:06:35 Старый Edge всё
00:12:02 Новинки Safari TP
00:21:54 React Native и Preact
00:29:02 MDN по-русски
00:33:12 Стили для печати
00:41:46 EditorConfig
00:48:35 Ховер или клик
00:57:31 Системные шрифты
События
• Видео с Я ❤ Фронтенд
• Design is Frontend онлайн 24 марта
• DUMP в Екатеринбурге 14 мая
• Secon в Пензе 19–20 июня
• 404fest X в сентябре
• Ищем мейнтейнера календаря
Старый Edge всё
• Microsoft Edge Legacy support ends today
Новинки Safari TP
• Safari Technology Preview 122
• Blink Intent to Prototype and Ship: ES Modules for SW
React Native и Preact
• Announcing React Native 0.64 with Hermes on iOS
• Как я полюбил и возненавидел React Native
• Preact Server Components
MDN по-русски
• Проект по переводу контента MDN
Стили для печати
• Я совсем забыл про стили для печати
• Распечатай мне курсач. На CSS
EditorConfig
• EditorConfig — порядок в текстовых файлах
Ховер или клик
• Why hover is a concept you should not use
Системные шрифты
Ведущие: Никита Дубко, Андрей Мелихов, Вадик Матвеев, Юля Миоцен
Темы
00:00:00 Интро
00:01:26 События
00:02:52 Chrome 89
00:11:00 Chrome DevTools
00:22:31 Релизы и приватность
00:29:44 История веба
00:37:55 Цвета из спеки
00:44:45 Зачем Consta
00:53:49 Как Consta
01:01:00 Когда Consta
01:07:00 Лэндинг Consta
Гости
• Вадик в Твиттере
• Юля в Твиттере
События
• RamblerFront& онлайн 18 марта
• Трансляция с Я ❤ Фронтенд
Chrome 89
Chrome DevTools
• What’s New In DevTools (Chrome 90)
Релизы и приватность
• Web API Controversy
• Speeding up Google Chrome’s release cycle
• Charting a course towards a more privacy-first web
История веба
• История фронтенда: Браузер, который умел всё
Цвета из спеки
Consta
• Consta — дизайн-система «Газпром нефти»
• Код лэндинга Consta
• Yandex UI Kit
• VKUI
• Scroll Spinning SVG
Ведущие: Вадим Макеев, Никита Дубко, Михаил Трошев
Темы
00:00:00 Интро
00:01:41 Свежий Safari TP
00:04:32 Firefox 86
00:08:31 Быстрый SVG на GPU
00:12:18 Куки в Firefox и Яндекс.Браузере
00:22:58 WebP, AVIF и JPEG XL
00:32:30 Офер в Яндекс за день
00:42:49 Буткемп и ШРИ
00:51:37 Зачем нужен ODO
Свежий Safari TP
• Release Notes for Safari Technology Preview 121
Firefox 86
• Firefox 86
• A Fabulous February Firefox — 86!
Быстрый SVG на GPU
• Updates in hardware-accelerated animation capabilities
Куки в Firefox и Яндекс.Браузере
• Firefox 86 Introduces Total Cookie Protection
• Яндекс.Браузер защитит от сторонних трекеров
WebP, AVIF и JPEG XL
• Maximally optimizing image loading for the web in 2021
• AVIF and WebP encoding quality settings
• It’s High Time to Replace JPEG With a Next-Generation Image Codec
Офер в Яндекс за день
Ведущие: Андрей Мелихов, Вадим Макеев, Алексей Симоненко, Роман Магдаленко
Темы
00:00:00 Интро
00:02:45 События
00:07:34 Инспектор флексов
00:09:32 Vite 2.0
00:16:36 SVGO 2.0
00:24:11 Wakamai Fondue
00:26:00 Зачем TypeScript
00:34:48 Аутсорс: Лёша
00:47:55 Аутсорс: Андрей
01:05:32 Аутсорс: Вадим
01:14:23 Новички в аутсорсе
События
• Я ❤ Фронтенд онлайн 27 февраля
• Призы для CTF
• Hot Frontend онлайн в SimbirSoft 5 марта
• Frontend Crew онлайн 12–23 апреля
• Темы для докладов Frontend Crew
Инспектор флексов
• Flexbox Editor fresh in Chromium Canary
Vite 2.0
SVGO 2.0
• SVGO 2.0
Wakamai Fondue
• Wakamai Fondue CLI: never write font CSS again!
Зачем TypeScript
• Tackling TypeScript: Upgrading from JavaScript
Аутсорс
• RedLab
Ведущие: Андрей Мелихов, Вадим Макеев, Никита Дубко, Сергей Иванов
Темы
00:00:00 Интро
00:02:04 Событие ЯЛФ
00:09:37 Прощание со старым Edge
00:14:16 Новости веб-платформы
00:19:06 Борьба с z-index
00:25:48 Нормальные однострочники
00:35:48 Атака на зависимости
00:45:53 Инди-веб
00:54:39 Что такое CTF
Событие ЯЛФ
• Я ❤ Фронтенд онлайн 27 февраля
Прощание со старым Edge
• New Microsoft Edge to replace Microsoft Edge Legacy with April’s Windows 10 Update Tuesday release
Новости веб-платформы
• Open Web Docs worklog, January 2021 edition
• Define container queries in css-contain-3
Борьба с z-index
• Managing CSS Z-Index In Large Projects
Нормальные однострочники
• 15 полезных однострочных выражений JavaScript
Атака на зависимости
• How I Hacked Into Apple, Microsoft and Dozens of Other Companies
• Рекомендации Microsoft
Инди-веб
Что такое CTF
• CTF в Петербурге в Телеграме
• CTF в Петербурге на Ютубе
• Frontend CTF №1
• Frontend CTF №2
• Канал Сергея в Телеграме
Ведущие: Андрей Мелихов, Вадим Макеев, Игорь Коровченко
Темы
00:00:00 Интро
00:01:25 Npm 7
00:14:15 Private Click Measurement
00:19:45 Обновление V8 v8.9
00:23:55 App History API
00:32:01 Прагматичные книги
00:36:45 Принцип работы Docker
00:44:03 Как пользоваться Docker
00:48:09 Разработка в Docker
00:55:21 Docker, чья проблема
Npm 7
• Npm 7 is now generally available!
• Presenting v7.0.0 of the npm CLI
Private Click Measurement
• Introducing Private Click Measurement, PCM
Обновление V8 v8.9
App History API
Прагматичные книги
Docker
• Распаковка Docker, часть 1
• Распаковка Docker, часть 2
• Распаковка Docker, часть 3
• Development Containers in Education
• Run and Debug your App in the Desired Environment
Ведущие: Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:00:54 События
00:04:47 Firefox 85
00:16:17 Safari TP 119
00:19:55 Бета Chrome 89
00:32:05 Chrome DevTools
00:41:14 Open Web Docs
00:43:58 Элемент popup
00:47:03 Локальный HTTPS
00:54:25 WCAG 3
00:58:40 Null или undefined
События
• MoscowJS Online прошёл онлайн 28 января
• Node Congress 2021 18-19 февраля
• Билеты со скидкой 15%
• React fwdays онлайн 27 марта
Firefox 85
Safari TP 119
• Release Notes for Safari TP 119
Бета Chrome 89
Chrome DevTools
Open Web Docs
Элемент popup
Локальный HTTPS
• How to use HTTPS for local development
• When to use HTTPS for local development
WCAG 3
Null или undefined
Ведущие: Вадим Макеев, Андрей Мелихов, Мария Просвирнина, Иван Дмитриев
Темы
00:00:00 Интро
00:01:36 События
00:02:18 Chrome 88
00:10:21 Картинки во флексах
00:12:06 Новый JS-метод at
00:16:56 Управление CSS-каскадом
00:26:58 Экосистема Smart TV
00:39:26 Интерфейс ТВ
00:47:41 Разработка под ТВ
00:58:54 Устройство ТВ-приложения
01:08:44 Видео для веба
События
• DINS JS Evening онлайн 28 января
Chrome 88
Картинки во флексах
• Flexbox Cats (a.k.a fixing images in flexbox)
Новый JS-метод at
• TC39: Relative Indexing Method
Управление CSS-каскадом
• CSS Cascading and Inheritance Level 5
• Первый публичный черновик CSS-каскада 5 уровня
• Пара слов о @layer
Ведущие: Вадим Макеев, Никита Дубко, Виталий Фридман
Темы
00:00:00 Интро
00:02:07 События и Smashing Conf
00:17:50 Puppeteer для Firefox
00:22:19 Состояние всего
00:38:55 Video как picture
00:53:59 Чек-лист по перфомансу
01:09:13 Нужен ли перфоманс
События и Smashing Conf
• Tver.io Performance Meetup онлайн 21 января
• Wix Kyiv: CSS Debug онлайн 27 января
• Smashing Workshops
• Холивар, история Рунета
Puppeteer для Firefox
• Improving Cross-Browser Testing, Part 2
Состояние всего
• State of JS 2020
• 2020 JavaScript Rising Stars
Video как picture
• HTML Video Element, Filament Group
Чек-лист по перфомансу
Ведущие: Андрей Мелихов, Никита Дубко, Мария Просвирнина, Дэн Абрамов
Темы
00:00:00 Интро
00:01:19 Safari TP 118
00:11:59 Подсветка ошибок на CSS
00:15:19 Загрузка HTML по частям
00:23:34 Suspense и Concurrent
00:40:07 Серверные компоненты
01:01:43 React уже фреймворк?
01:10:16 Сложный бэкенд и SSR
Safari TP 118
• Release Notes for Safari Technology Preview 118
• Репозиторий WebKit на GitHub
• Телеграм-канал «Вебня»
Подсветка ошибок на CSS
• Intent to Prototype: CSS spelling and grammar features
Загрузка HTML по частям
• Loading and replacing HTML parts with HTML
• Smaller HTML Payloads with Service Workers
React Server Components
• Zero-Bundle-Size Server Components
• A few points about the different kinds of components
• React Server Components — что это?
• React Server Components Demo with Prisma
Ведущие: Никита Дубко, Андрей Мелихов, Вадим Макеев
Темы
00:00:00 Интро
00:02:08 События Андрея
00:12:30 Привет от Маши
00:13:29 События Никиты
00:32:45 Привет от Оли
00:38:45 События Вадима
00:59:44 Привет от Лёши
01:04:59 Пожелания
01:10:56 Благодарности
Андрей
• Девшахта Андрея на YouTube
• Я ❤︎ Фронтенд 2020
• Node.js Design Patterns
• Newsletter by architects for architects
• Client-Side Architecture Basics
Никита
• Никита на YouTube
• Перевод Никиты на Веб-стандартах
• Книга Debugging CSS
• Monument Valley на чистом CSS
• Генератор статики Eleventy
Оля
Вадим
• Вадим на YouTube
• Твиттервью Эрика Мейера
• Дебаты про ремоут
• Вакансия автора в HTML Academy
• GitHub Codespaces и кодинг на iPad
• Подкаст The F-Word
Ведущие: Мария Просвирнина, Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:03:24 JS-андерхуд
00:07:28 Фокус в веб-приложениях
00:13:07 Фавиконки в 2021
00:16:58 История JS-фреймворков
00:19:47 React Server Components
00:38:47 Basecamp Hotwire
JS-андерхуд
• Вадим в JS-андерхуде
• Маша в JS-андерхуде
Фокус в веб-приложениях
• How Discord Implemented App-Wide Keyboard Navigation
• CSS Spatial Navigation L1
Фавиконки в 2021
• How to Favicon in 2021: Six files that fit most needs
История JS-фреймворков
• Что нужно знать о популярных JS-фреймворках
React Server Components
• Zero-Bundle-Size Server Components
• React Server Components
• A few points about the different kinds of components
Basecamp Hotwire
• Hotwire aka NEW MAGIC is finally here
• Hotwire
• Turbo Hotwire
• Stimulus Hotwire
• Hotwire: The Demo
Ведущие: Ольга Алексашенко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:52 События
00:03:13 Отдельные трансформации
00:09:16 Firefox 84
00:16:16 Боль разработчиков
00:27:26 MDN на Гитхабе
00:37:04 Удивительные черновики CSS
00:50:15 Переполнение и недополнение
00:56:44 Способы центрирования
01:02:09 Залоченный вьюпорт
События
• Видео с JavaScript fwdays’20 Autumn
• Sbermeetup онлайн 22 декабря
Отдельные трансформации
• CSS Individual Transform Properties
Firefox 84
• Firefox 84
• Как воспитать дизайнера
Боль разработчиков
• MDN Browser Compatibility Report 2020
MDN на Гитхабе
• Welcome Yari: MDN Web Docs has a new platform
Удивительные черновики CSS
• Earlier in the week I posted progress on…
• Cascade Layers
• Scope
• Container Queries
Переполнение и недополнение
• Handling Short And Long Content In CSS
Способы центрирования
Залоченный вьюпорт
Ведущие: Вадим Макеев, Никита Дубко, Максим Сальников
Темы
00:00:00 Интро
00:02:32 События
00:09:07 Веб-альманах 2020
00:20:09 Safari TP и списки
00:28:23 Новинки PWA
00:42:42 EStimate лишний JS
00:53:23 Загрузка по заявке
01:01:41 Демки для Houdini
01:11:24 Squoosh 2 и CLI
Максим Сальников
События
• Видео с Accessibility Club Minsk Meetup #2
• Видео с Chrome Dev Summit 2020
• Chrome Dev Summit Russia 2020 Extended онлайн 19 декабря
• PWA. 5 лет спустя
Веб-альманах 2020
Safari TP и списки
• Release Notes for Safari TP 117
Новинки PWA
EStimate лишний JS
• Publish, ship, and install modern JS for faster applications
• EStimator.dev: the modern JavaScript savings calculator
Загрузка по заявке
• The Import On Interaction Pattern
Демки для Houdini
• Cross-browser paint worklets and Houdini.how
• Houdini.how
• CSS paint API: Being predictably random
Squoosh 2 и CLI
Ведущие: Ольга Алексашенко, Никита Дубко
Темы
00:00:00 Интро
00:00:48 События
00:02:20 Бета Chrome 88
00:10:03 State of CSS: разнообразие
00:14:41 State of CSS: инструменты
00:17:49 State of CSS: фреймворки
00:25:08 State of CSS: открытия
00:30:29 State of JS
00:34:01 Шрифты для кодинга
00:36:29 Monument Valley на CSS
00:40:02 Верстать как в 2008
00:47:49 Как сверстать сторис
00:52:48 Пуньк и 27 Кб
События
• JSNN #14 онлайн 5 декабря
• PiterJS + Node.js SPb онлайн 10 декабря
Бета Chrome 88
• Chrome 88 Beta
• Native Aspect Ratio Boxes in CSS thanks to aspect-ratio
State of CSS
• The State of CSS 2020
• Is Our Survey Biased Against Women?
State of JS
Шрифты для кодинга
Monument Valley на CSS
Верстать как в 2008
• Верстать как в 2008, или Флэшбеки олдфага
Как сверстать сторис
• Building a Stories component
Пуньк и 27 Кб
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:27 События
00:04:15 Bocoup и appearance
00:09:29 Нестинг в CSS
00:18:21 Адаптация таблиц
00:27:23 Устройство браузера
00:41:38 Смёржить всё в JS
00:53:28 Ценность разделения
События
• PiterJS прошёл онлайн 27 ноября
• SEMrush IT meetup онлайн 3 декабря
• Design is Frontend онлайн 9 декабря
Bocoup и appearance
• Unprefixing appearance to ship web-compatible styling of form elements
Нестинг в CSS
• Current state of the CSS Nesting spec
Адаптация таблиц
• Under-Engineered Responsive Tables
• When is it appropriate to use table?
Устройство браузера
• Устройство современного браузера, часть 1
• Устройство современного браузера, часть 2
• Устройство современного браузера, часть 3
• Устройство современного браузера, часть 4
• How Browsers Work: Behind the scenes of modern web browsers
• Inside a super fast CSS engine: Quantum CSS (aka Stylo)
• Tags to DOM
• Braces to Pixels
Смёржить всё в JS
• The Grand Unification Proposal
Ценность разделения
• Why it’s good for users that HTML, CSS and JS are separate languages
Ведущие: Вадим Макеев, Никита Дубко, Саша Шинкевич
Темы
00:00:00 Интро
00:01:14 События
00:03:05 Chrome 87
00:10:24 Chrome DevTools
00:15:14 Firefox 83
00:24:23 Новый дом для Servo
00:28:26 Safari 14
00:38:38 Open Prioritization
00:44:57 Кэш туда-обратно
00:53:38 Гриды и minmax
События
• Я.Субботник 21 ноября
• Vue.js fwdays’20 онлайн 28 ноября
• Front-End Hero Meetup онлайн 3 декабря
Chrome 87
Chrome DevTools
Firefox 83
• Firefox 83 for developers
• Firefox 83 — обзор Марата Таналина
• Simple pie charts with fallback, today
Новый дом для Servo
Safari 14
• New WebKit Features in Safari 14
Open Prioritization
• Open Prioritization First Experiment Wrap Up
Кэш туда-обратно
• Back/forward cache
• BFCache, или Туда и обратно
Гриды и minmax
Ведущие: Вадим Макеев, Никита Дубко, Глеб Воронцов, Иван Недзвецкий
Темы
00:00:00 Интро
00:01:27 События
00:06:29 Chrome DevTools
00:17:20 Прощай HTTP-пуш
00:24:29 Apple на ARM
00:30:02 Состояние разметки
00:37:11 Новая книга по CSS
00:41:33 Пиксель-пёрфект
00:52:29 Миниапы ВК
00:59:00 Технологии
01:06:27 Зачем это всё
01:13:29 Где деньги
События
• PWA пять лет спустя онлайн 20 ноября
• ЮMoneyDay онлайн 28 ноября
• YaTalks онлайн 5 декабря
• Chrome Dev Summit онлайн 9–10 декабря
Chrome DevTools
• What’s New In DevTools (Chrome 88)
Прощай HTTP-пуш
• Intent to Remove: HTTP/2 and gQUIC server push
Apple на ARM
Состояние разметки
Новая книга по CSS
Пиксель-пёрфект
• Chasing the Pixel-Perfect Dream
Миниапы ВК
• Сообщество разработчиков Mini Apps
• Документация
• Каталог приложений
• VKUI
Ведущие: Ольга Алексашенко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:50 Подсказки для флексов
00:06:01 File API не стандарт
00:15:34 Выражения от контейнера
00:29:43 Зачем вообще ARIA
00:36:18 Переменные и темы
00:45:14 Масонри в гридах
Подсказки для флексов
• Dynamic contextual flexbox alignment icons!
File API не стандарт
• Google’s File System Access API is not a standard
Выражения от контейнера
• All Them Switches: Responsive Elements and More
• Intent to Prototype: Container Queries
• Предложение
• Вариация
• I’d like to try Container Queries!
• Орущий ковбой
Зачем вообще ARIA
Переменные и темы
• Sass vars, CSS vars, and semantic theme vars
• Professional color palette
Масонри в гридах
Ведущие: Вадим Макеев, Никита Дубко, Надя Наширбанова
Темы
00:00:00 Интро
00:01:21 События
00:06:06 Mozilla против фич
00:17:09 Microsoft против IE
00:24:59 Адаптивность от высоты
00:37:37 Миниапы в суперапах
00:57:58 Дизайнер в Яндексе
События
• Я.Субботник по разработке интерфейсов онлайн 21 ноября
Mozilla против фич
• Mozilla Specification Positions
Microsoft против IE
• Microsoft will forcibly open some sites in Edge instead of IE
Адаптивность от высоты
• Отзывчивый веб-дизайн и учёт высоты окна браузера
Миниапы в суперапах
Дизайнер в Яндексе
Ведущие: Ольга Алексашенко, Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:52 События
00:03:40 Edge и Safari
00:08:56 Бета Chrome 87
00:17:10 Firefox 82
00:29:25 MDN и State of CSS
00:37:32 Структура CSS
00:51:04 История браузеров
События
• Svelte Summit онлайн 18 октября — видео
• Tver.io Open Source Talks онлайн 30 октября
• BEMup — онлайн-митап по БЭМ 6 ноября
• Планета Гитхаб онлайн 17 ноября
• Я.Субботник по разработке интерфейсов онлайн 21 ноября
Edge и Safari
• Introducing Microsoft Edge preview builds for Linux
• Safari TP 114
• Safari TP 115
Бета Chrome 87
Firefox 82
• Firefox 82
• Coming through with Firefox 82
MDN и State of CSS
• MDN Web Docs: Editorial strategy and community participation
• The State of CSS Survey
Структура CSS
История браузеров
• Движок, который смог: как Chromium захватил 90%
• The History of the Web, Volume I на Leanpub
Ведущие: Вадим Макеев, Никита Дубко, Антон Кастрицкий
Темы
00:00:00 Интро
00:01:33 События
00:04:27 Опрос MDN
00:12:05 Открытые приоритеты Igalia
00:15:28 Новинки Npm 7
00:27:08 React vs WordPress
00:35:27 Уже Webpack 5
00:43:48 Что такое Rome
00:56:04 Инструмент будущего
Антон Кастрицкий
• Антон в Твиттере
• Антон на Твитче
События
• Next.js Conf онлайн 27 октября
• Chrome Dev Summit 9–10 декабря
Опрос MDN
Открытые приоритеты Igalia
• Two projects remain
• AMP: $10k matching campaign
Новинки Npm 7
• Presenting v7.0.0 of the npm CLI
React vs WordPress
• The (extremely) loud minority
Уже Webpack 5
Что такое Rome
• Репозиторий Rome
• Сайт Rome
• I’ve been looking at the Rode source code…
Ведущие: Вадим Макеев, Зар Захаров
Темы
00:00:00 Интро
00:01:23 События
00:12:23 Chrome 86
00:21:38 Safari и Firefox
00:26:04 Начало UI-кита
00:38:13 SSR и Next.js
00:50:03 Про Зара
00:58:22 JS-марафоны
События
• Facebook Developer Circle: Frontend Online онлайн 15–17 октября
• Dynamic Talks UI meetup онлайн 15 октября
• Frontend Meetup в Иннополисе 10 октября
Chrome 86
Safari и Firefox
• Release Notes for Safari TP 114
• Reveal the elements which are causing the overflow
Начало UI-кита
• Зачем нужна выделенная Frontend Core команда
SSR и Next.js
• Почему я выбрал Next.js, а не Gatsby, Gridsome или Nuxt?
Зар и JS-марафоны
Ведущие: Вадим Макеев, Никита Дубко, Роман Дворнов
Темы
00:00:00 Интро
00:01:42 События
00:03:15 Edge в VS Code
00:12:42 Инспектор гридов в Chrome
00:29:46 Gap и баги флексов
00:37:53 Математика в CSS
00:46:42 Hacktoberfest
00:53:15 Shitoberfest
01:00:51 Опенсорс Романа
События
• BeerJS.NN в Нижнем Новгороде 1 октября
• Frontend Meetup в Иннополисе 10 октября
• Календарь событий
Edge в VS Code
• Bringing the browser developer tools to VS Code
Инспектор гридов в Chrome
• What’s New In DevTools
• Inspect CSS Grid
Gap и баги флексов
Математика в CSS
• Математические функции в CSS
• The math of CSS Locks
• Баба Яга против
Hacktoberfest
Shitoberfest
• Ugh, oh no, October is starting
• Shitoberfest
• Hacktoberfest update
Опенсорс Романа
• Домашняя страница
• CSSTree
• CSSO
• Postcss-csso
• Discovery
• CSS syntax reference
• CSSWG drafts index
• Json-ext
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:52 Чат в Телеграме
00:03:42 События
00:05:09 Firefox 81
00:09:32 Vue 3
00:18:16 GitHub CLI
00:27:34 Отладка CSS
00:36:22 Новая Nova
00:49:00 Редактор для веба
Чат в Телеграме
События
• OdessaFrontend #16 в Одессе 30 сентября
• Inclusive Design 24
Firefox 81
Vue 3
• Вышел Vue.js 3.0 «One piece»
• Выпуск с Натальей Теплухиной из Vue Core Team
GitHub CLI
• GitHub CLI 1.0 is now available
• Mathias’s dotfiles
• GitHub Pull Requests and Issues
Отладка CSS
• Finding The Root Cause of a CSS Bug
• Крис Лилли
Новая Nova
Редактор для веба
• GitHub Codespaces
• Using a Docker Container as a Dev Environment
Ведущие: Вадим Макеев, Сергей Куликов, Влад Шилов
Темы
00:00:00 Интро
00:02:09 События
00:04:50 Safari 14
00:14:45 Миссия PostCSS 8
00:26:35 Moment.js всё
00:30:33 React и веб-компоненты
00:41:21 История двух колор-пикеров
00:51:14 Сравнение подходов
01:03:27 Доступность решения
События
• PiterJS онлайн 24 сентября
• JavaScript EVENING онлайн 30 сентября
• Frontend Conf Live онлайн 23 сентября—2 октября
• Расписание
• Регистрация
Safari 14
• Safari on iOS 14 and iPadOS 14 for Web Developers
• CSS Shadow Parts are coming!
Миссия PostCSS 8
• PostCSS 8.0: Plugin migration guide
Moment.js всё
React и веб-компоненты
• Comparing React and Web Components: Starters
• Comparing React and Web Components: Components
История двух колор-пикеров
• Супер быстрый и компактный колор-пикер для Реакта
• У библиотеки одна зависимость — React
• React-colorful
• React-colorful: демо
• Vanilla-colorful
• Vanilla-colorful: демо
• Розеттский камень
Ведущие: Вадим Макеев, Никита Дубко, Иван Богачёв
Темы
00:00:00 Интро
00:01:22 События
00:04:07 Edge DevTools
00:17:28 Разнообразие браузеров
00:30:39 Польза от AVIF
00:42:14 Генераторы статики
00:51:19 Математика для фронтендера
00:58:05 Зачем Хабр и Тостер
01:03:51 Устарело ли чтение
01:10:33 Кому нужны переводы
События
• Front-end Hero Online Meetup онлайн 17 сентября
• Inclusive Design 24 онлайн 17 сентября
Edge DevTools
• Microsoft Edge 86: What’s New In DevTools
• Source Order Viewer in Edge 86
Разнообразие браузеров
• What is the Value of Browser Diversity?
Польза от AVIF
Генераторы статики
• Знакомство с генератором статики Eleventy
Математика для фронтендера
• Временные функции и траектории для анимации
• Математика для программиста
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:01:45 Бета Chrome 86
00:17:15 Пользовательский фокус
00:22:32 Псевдоэлемент ::marker
00:28:00 Отладка шрифтов
00:31:03 Инструкция по скринридерам
00:38:54 Модальный компонент
00:42:01 Шапка на флексах
00:47:48 Что делать с селектом
Бета Chrome 86
• Chrome 86: Improved Focus Highlighting, WebHID, and More
Пользовательский фокус
• Chromium Blog: Giving users and developers more control over focus
• Хороший и плохой focus, полифил focus-visible и Open Prioritization
Псевдоэлемент ::marker
• Custom bullets with CSS ::marker
Отладка шрифтов
• In new Chrome DevTools, you can finally disable local fonts loading!
Инструкция по скринридерам
Модальный компонент
• Modal. A simple, accessible modal dialog web component
Шапка на флексах
• Building Website Headers with CSS Flexbox
• Адаптивная шапка с выпадающим меню на гридах, часть 1
• Адаптивная шапка с выпадающим меню на гридах, часть 2
Что делать с селектом
• Under the spotlight: Select
• Custom Select Styles with Pure CSS
Ведущие: Вадим Макеев, Никита Дубко, Андрей Ситник
Темы
00:00:00 Интро
00:01:34 Firefox 80
00:07:44 Chrome 85
00:22:47 Никто не новый IE
00:34:34 Зачем Yarn 2
00:42:35 Новый формат AVIF
Firefox 80
• Марат Таналин: Firefox 80
• MDN: Firefox 80
• Firefox Browser в Google Play
• GeckoView
Chrome 85
• New in Chrome 85
• София Валитова: Типы данных в CSS
Никто не новый IE
• Chrome is not new IE, Крис Уилсон
Зачем Yarn 2
• Yarn 2.2
Новый формат AVIF
• How to Use AVIF: The New Next-Gen Image Compression Format
• Squoosh.app now supports AVIF!
• Better web video with AV1 codec
• WebPv2?
• What image format will win the mainstream in the future?
Ведущие: Вадим Макеев, Евгений Некрасов, Никита Савчук
Темы
00:00:00 Интро
00:01:47 События
00:04:11 Новая типографика
00:08:15 Исследование Яндекса
00:23:17 Опыт Фейсбука
00:30:38 Отладка доступности
00:37:54 Новые интерфейсы
00:45:25 Что мешает в вебе
00:56:52 Скринридеры
Евгений Некрасов
События
• PiterJS онлайн 27 августа
• BeerJS.NN в Нижнем Новгороде 3 сентября
Новая типографика
• Leading-Trim: The Future of Digital Typesetting
Исследование Яндекса
• Предпочтения пользователей с нарушениями зрения
• Early Mac Firefox VoiceOver Support
Опыт Фейсбука
• Building greater accessibility into Facebook.com
Отладка доступности
• Accessibility In Chrome DevTools
• Accessible color suggestion in the Styles pane
Новые интерфейсы
Что мешает в вебе
• 5 most annoying website features I face as a blind person every single day
Ведущие: Вадим Макеев, Ольга Алексашенко
Темы
00:00:00 Интро
00:02:02 PhoneGap всё
00:09:26 Решение проблемы фокуса
00:14:46 Система цветов и тем
00:23:37 Зачем в CSS километры
00:28:32 Кризис Mozilla и бесплатный веб
События
• Frontend Live онлайн 23 сентября—2 октября
PhoneGap всё
• Is the Phone Gap closed in 2020?
Решение проблемы фокуса
• Хороший и плохой focus, полифил focus-visible и Open Prioritization
Система цветов и тем
• How to configure application color schemes with CSS custom properties
Зачем в CSS километры
Кризис Mozilla и бесплатный веб
• Changing World, Changing Mozilla
• Reducing investment in devtools, internal tooling, platform features
• Product Advisory Board Members
• Firefox Developer Tools will not be going away
• The cult of the free must die
• I Love MDN, or the cult of the free in action
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:01:08 События
00:03:47 Инспектор гридов в Chrome
00:09:27 Долгожданная настройка форм
00:23:03 Хитрый сбор всех CSS-свойств
00:29:41 Content-visibility
00:37:57 Польза вариативных шрифтов
00:53:06 Бесконечные списки
События
• Node.js в 2020 в школе Метархии под Киевом 22–23 августа
• Node.js in 2020. Get out and come back again
• Design is Frontend онлайн 20 августа
Инспектор гридов в Chrome
• Chromium CSS Grid Devtools update
Долгожданная настройка форм
• Enabling Custom Control UI
• Open UI
Хитрый сбор всех CSS-свойств
• Introspecting CSS via the CSS OM
Content-visibility
• Content-visibility boosts your rendering performance
Польза вариативных шрифтов
• Getting the most out of variable fonts on Google Fonts
Бесконечные списки
Ведущие: Вадим Макеев, Ольга Алексашенко, Алексей Симоненко
Темы
00:00:00 Интро
00:01:37 Сайд-подкасты
00:10:53 Онлайн-события
00:16:57 Новости браузеров
00:30:48 Main вместо master
00:43:21 Поиски эмпатии
Сайд-подкасты
• Красная за разговоры
• The F-Word
• LP — любимые пластинки
• Будни домена Флоренция
Онлайн-события
• HolyJS Moscow онлайн 25–28 ноября
Новости браузеров
• Firefox 79
• Firefox UA string on macOS
• Алекс Рассел
• Тимоти Хэтчер
Main вместо master
• Highlights from Git 2.28
• Renaming the default branch from master
Поиски эмпатии
• Доступный для кого-то
• Тренды веб-дизайна 2020: модное и значимое
Ведущие: Вадим Макеев, Никита Дубко, Андрей Яманов
Темы
00:00:00 Интро
00:01:22 События и MoscowJS
00:04:53 Бета Chrome 85
00:18:37 TypeScript в Svelte
00:25:16 Типизированный CSS
00:34:15 Сброс в CSS
00:42:05 Что такое Numl
События и MoscowJS
• PiterJS #49 онлайн 30 июля
• MoscowJS
Бета Chrome 85
• Chrome 85 Beta
• Будущее навигации в веб. Разбираемся с Portals API
TypeScript в Svelte
Типизированный CSS
• The F-Word: Brian Kardell on Open Prioritization
• @property: giving superpowers to CSS variables
Сброс в CSS
• Объяснение ключевых слов initial, inherit, unset и revert в CSS
• Никто не знает CSS: специфичность — не каскад
Что такое Numl
• Numl — альтернативный язык разметки и стилизации для веб
• Официальный сайт Numl
• Чат в Телеграме
Ведущие: Вадим Макеев, Никита Дубко, Виталий Емельянцев
Темы
00:00:00 Интро
00:01:23 События
00:04:42 Chrome 84
00:19:21 Нативный параллакс
00:26:04 Архив GitHub во льдах
00:35:07 Open Prioritization
00:45:17 Счётчик Lighthouse
00:52:55 Tailwind на практике
01:10:12 Tailwind как Bootstrap
События
• Видео с WebAssembly Moscow #3
• Видео с WebAssembly Moscow #2
• Tver.io State Management Talks онлайн 23 июля
Chrome 84
• New in Chrome 84
• What’s New In DevTools (Chrome 84)
Нативный параллакс
• Scroll-linked Animations
• Scroll-timeline polyfill
Архив GitHub во льдах
Open Prioritization
• Open Prioritization
• Implementing :not() in Chrome
• Implementing CSS Containment
Счётчик Lighthouse
• I added Lighthouse scores to my site’s footer and you can too
Tailwind
• Очередной фреймворк или новый шаг эволюции?
• TailwindCSS
• Преимущества многострочного CSS
Ведущие: Вадим Макеев, Никита Дубко, Владимир Гриненко
Темы
00:00:00 Интро
00:02:08 События в Яндексе
00:09:10 Подкаст про Safari
00:12:50 Планы браузеров
00:22:21 Новый CSS Zen Garden
00:29:53 Кто быстрее: Houdini или CSS
00:38:58 Yandex UI Kit
Подкаст про Safari
Планы браузеров
• Browser Intents: July
• CSS News July 2020
Новый CSS Zen Garden
Кто быстрее: Houdini или CSS
• CSS Painting vs. CSS Houdini Paint API
Yandex UI Kit
Ведущие: Вадим Макеев, Никита Дубко, Полина Гуртовая
Темы
00:00:00 Интро
00:01:32 События
00:05:04 Firefox 78
00:15:13 Новинки V8 8.4
00:26:19 Интересное с Web.Dev Live
00:52:10 Сравнение WebP и JPEG
01:04:24 Небезопасные API
События
• Reactive Online Meetups онлайн 7 июля
• Web.Dev Live Russia онлайн 11 июля
• The Rolling Scopes онлайн 17 июля
Firefox 78
• Firefox 78 for developers
• Firefox 78 в обзоре Марата Таналина
Новинки V8 8.4
• V8 release v8.4
• What’s new in V8/JavaScript
Интересное с Web.Dev Live
• Web.Dev Live, 1 день
• Web.Dev Live, 2 день
• Web.Dev Live, 3 день
• Image compression deep-dive
• Картинки как коробки. Что же там внутри?
• Показываем картинки пользователю: подробное руководство
• 10 modern layouts in 1 line of CSS
• 1-Line Layouts
• Building better in the world of build tools!
• Tooling.Report
Сравнение WebP и JPEG
• Is WebP really better than JPEG?
• Imgproxy
Небезопасные API
• WebKit will not implement
• Mozilla also won’t implement these either
• Are Safari/WebKit teams lazy?
• Tracking Prevention in WebKit
• Mozilla Specification Positions
• Platform Adjacency Theory
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:24 События и онлайн-доклады
00:11:15 DevTools в Chrome и Edge
00:23:04 Большие новости Safari 14
00:42:00 Date и Temporal
00:48:58 TypeScript 4
00:54:28 Зачем TypeScript
События и онлайн-доклады
• Vue.js: The Documentary по-русски
• NodeSchool SPb онлайн 4 июля
• Web.Dev Live онлайн 30 июня—2 июля
• DevParty онлайн 27 июня
• Записи докладов секции Web с DevParty
DevTools в Chrome и Edge
• Edge 84: What’s new in Microsoft DevTools
• Chrome 85: What’s New In DevTools
Большие новости Safari 14
• Safari 14 Beta Release Notes
• Safari TP 109 with Safari 14 Features
• Quick thread on new things worth mentioning
• What’s new for web developers
• Meet Face ID and Touch ID for the web
• Meet Safari Web Extensions
• What’s new in Web Inspector
Date и Temporal
• Dates and Times in JavaScript
• Пару календарей назад я был совсем другим
TypeScript 4
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:27 События
00:06:27 Евангелист Safari
00:11:30 Альфа Bootstrap 5
00:23:09 Content-visibility
00:34:53 Справочник по гридам
00:41:43 Доступные чекбоксы правильно
00:50:14 Атрибут forms
00:56:39 Обзор API для PWA
События
• HolyJS Piter онлайн 22–26 июня
• DevParty онлайн 27 июня
• Я.Субботник онлайн 4 июля
Евангелист Safari
• I’m Apple’s newest Web Technologies Evangelist for Safari & WebKit
Альфа Bootstrap 5
Content-visibility
• CSS content-visibility property
• CSS contain property
Справочник по гридам
• Grid Cheatsheet
• Flexbox Cheatsheet
Доступные чекбоксы правильно
• Inclusively Hiding & Styling Checkboxes and Radio Buttons
• Can we please style the select control?!
• Open UI
Атрибут forms
Обзор API для PWA
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:02:11 Путь фронтендера на MDN
00:07:08 Меню из иконки приложения
00:11:05 QuicTransport API
00:16:19 Намерения браузеров
00:19:21 Скорость кастомных свойств
00:25:37 Состояние CSS Houdini
00:36:02 Очистка памяти
00:38:59 Записи и кортежи в ES
Событие
• A11y Club Minsk Meetup #1 онлайн 17 июня
Путь фронтендера на MDN
• MDN Front-end learning pathway
Меню из иконки приложения
• Get things done quickly with app shortcuts
QuicTransport API
• Experimenting with QuicTransport
Намерения браузеров
Скорость кастомных свойств
• Performance of CSS Variables
• Hybrid positioning with CSS variables and max()
Состояние CSS Houdini
• CSS Houdini
• Is Houdini ready yet‽
• CSS Canvas Drawing
Очистка памяти
• Event listeners and garbage collection
Записи и кортежи в ES
Ведущие: Вадим Макеев, Никита Дубко, Лиана Гукасян
Темы
00:00:00 Интро
00:01:41 События
00:04:05 Firefox 77
00:11:42 Всё про цвета в CSS
00:25:24 Учить ли TCP
00:32:21 CUBE или БЭМ
00:48:31 Переход на Linux
00:56:04 Учить ли новичков CRA
01:04:35 Сахар или ваниль
01:15:10 Где брать опыт работы
01:20:54 Польза от менторства
Партнёр
SkillFactory: Специализация фронтенд-разработчик
Скидка 50% по промокоду «Веб-стандарты» до 18 июня.
События
• PiterJS онлайн 11 июня
• JSNation Live онлайн 18–19 июня
• HolyJS Piter онлайн 22–26 июня
• Web.dev Live онлайн 30 июня—2 июля
Firefox 77
• New in Firefox 77
• Обзор Марата Таналина
Всё про цвета в CSS
• Colors in CSS
• Modern MQ syntax in all browsers
Учить ли TCP
• What every developer should know about TCP
CUBE или БЭМ
• CUBE CSS
Переход на Linux
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:28 События
00:02:54 Edge DevTools
00:10:35 Web Vitals, SEO, AMP
00:17:51 10 лет адаптивности
00:25:21 Улучшение веб-платформы
00:40:30 Взгляд на JS-экосистему
00:54:55 Вертикальный ритм
События
• Web.dev Live 30 июня—2 июля
• HolyJS 2020 Piter онлайн, 22–26 июня
Edge DevTools
Web Vitals, SEO, AMP
• Evaluating page experience for a better web
10 лет адаптивности
• Responsive Web Design на A List Apart
• Книга на A Book Apart
• Happy anniversary to this easter egg!
Улучшение веб-платформы
• Web Engine Diversity and Ecosystem Health
• 7 years of code divergence, culminating in LayoutNG
• Next up Tables! Tables have the most layout bugs
• Introducing the Web Platform Contribution Guide
• Web Platform Contribution Guide
• How you can improve the Web Platform
Взгляд на JS-экосистему
• Взгляд на JavaScript со стороны
Вертикальный ритм
• How to Easily Create a Responsive Vertical Rhythm with CSS
• Канал Никиты на Ютубе
Ведущие: Вадим Макеев, Никита Дубко, Алексей Охрименко
Темы
00:00:00 Интро
00:01:20 События
00:08:47 Microsoft Build
00:15:13 Новинки Chrome 83
00:22:46 Lighthouse 6
00:29:15 Быстрый Google Fonts
00:35:55 Аудит перфоманса Notion
00:44:26 Angular по-русски
События
• РИТ онлайн 25–26 мая
• ngVikings онлайн 25–26 мая
• CodeBattle Pro онлайн 25 мая
• JS Dev Day онлайн 25 мая
• Лайв с Натальей Теплухиной онлайн 25 мая
• Jamstack Conf онлайн 27 мая
• Show And Tell #2 онлайн 30 мая
Microsoft Build
Новинки Chrome 83
Lighthouse 6
• What’s New in Lighthouse 6.0
• Калькулятор весов
Быстрый Google Fonts
Аудит перфоманса Notion
• Case study: Analyzing Notion app performance
Angular по-русски
• Документация по Angular по-русски
• Сообщество Angular в Телеграме
• Сообщество TensorflowJS в Телеграме
Ведущие: Никита Дубко, Мария Просвирнина, Андрей Мелихов
Темы
00:00:00 Интро
00:01:07 События
00:03:35 Aspect ratio, DevTools, реклама
00:17:46 Кроссбраузерный appearance: none
00:23:40 Top-level await в Node.js
00:34:52 Deno вместо Node
00:54:25 Постоянное хранилище
01:02:15 Дорогая цена стилей
События
• PiterJS онлайн 21 мая
• JS Dev Day онлайн 24–29 мая
• Jamstack Conf онлайн 27 мая
• JSNation Live онлайн 18–19 июня
Aspect ratio, DevTools, реклама
• Aspect ratio in Chrome Canary
• Chrome platform status: CSS aspect-ratio
• What’s new in Chrome 84 DevTools
• Handling heavy ad interventions
Кроссбраузерный appearance: none
• Cross-browser appearance: none
Top-level await в Node.js
• Experimental top-level await in Node.js
• Add support for top level await
Deno вместо Node
• Deno 1.0
• Deno in 100 Seconds
• Пробуем Deno на примере простейшего сервера и React SSR
Постоянное хранилище
Дорогая цена стилей
• Дорогая цена стилей
• Critical resources and the first 14 KB
• Лекция Виталия Харисова «10k»
Ведущие: Вадим Макеев, Никита Дубко, Мария Просвирнина
Темы
00:00:00 Интро
00:01:00 События
00:03:58 Новости браузеров
00:13:05 Web Vitals
00:23:36 Хранилища в браузерах
00:32:37 Logical assignment в V8
00:37:51 Github Codespaces
00:47:00 Непонятные min и max
00:54:28 Наша ответственность
События
• Дискуссия про тестовые задания онлайн 16 мая
• ngVikings 2020 онлайн 25–26 мая
• MinskJS Meetup #8 онлайн 28 мая
• JS Nation Live онлайн 18–19 июня
Новости браузеров
• Chromium lands Flexbox gap
• Chrome: Screen Wake Lock API
• Stay awake with the Screen Wake Lock API
• Firefox 76: Audio worklets and other tricks
• Firefox 76 в обзоре Марата Таналина
Web Vitals
• Introducing Web Vitals: essential metrics for a healthy site
• Optimize Largest Contentful Paint
• Optimize First Input Delay
• Optimize Cumulative Layout Shift
• Web-vitals
• Web-vitals-extension
Хранилища в браузерах
Logical assignment
Github Codespaces
• GitHub Codespaces
• Codespaces on the iPad
Непонятные min и max
• Min()/max() both with exactly like JS
• CSS min() and max() functions are counterintuitive
Наша ответственность
• CSS Only Tooltip for All Screen Sizes
• Наша бессмысленная погоня за семантической ценностью
• Ценность осмысленности
• Культ карго CSS
• Архитектура CSS
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:49 Новинки DevTools
00:21:45 Сайт Веб-стандартов
00:27:37 Выделение текста
00:34:23 Пиксели против ремов
00:47:00 Атомарный CSS-in-JS
01:01:35 Автоматизация рефакторинга
Новинки DevTools
• Chrome: It’s almost here. CSS grid tooling!
• Edge: Coming soon. CSS Grid tooling!
• Masonry Grids in Firefox Nightly behind a flag
• Обсуждение спецификации Masonry layout
• A demo of new CSS to accomplish a Masonry-style layout
• Compatibility panel in Firefox based on MDN data
• Proposal for container queries
• Can I Include
Сайт Веб-стандартов
• Сайт Веб-стандартов
• Ишьи в репозитории сайта
Выделение текста
• Using CSS to Control Text Selection
• Selection in CSS
Пиксели против ремов
• Accessible Font Sizing, Explained
• Ишья про единицы измерения
Атомарный CSS-in-JS
Автоматизация рефакторинга
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:50 События
00:05:23 Возвращение cssunderhood
00:07:09 Сайт «Веб-стандартов»
00:10:01 Бета Chrome 83
00:17:18 Цветовые функции в CSS
00:21:16 Типизированный CSS
00:24:49 Кастомные свойства и гриды
00:47:43 Бротли, Зопфли и Гуцли
00:57:44 Цена JS-фреймворков
События
• Видео с Я.Субботника 25 апреля
• Node.js SPb MeetUp11 онлайн 28 апреля
• DINS JS EVENING онлайн 29 апреля
• IT Jam. Front-end онлайн 30 апреля
• Онлайн-митапы с живым общением: Фронтенд
Возвращение cssunderhood
Сайт «Веб-стандартов»
• Обновлённый сайт Веб-стандартов
• Репозиторий на Гитхабе
Бета Chrome 83
Цветовые функции в CSS
Типизированный CSS
• Chrome: Intent to Ship: @property
Кастомные свойства и гриды
• Кастомные свойства вместо CSS-переменных на PostCSS
• Используйте кастомные свойства вместо препроцессорных переменных на здоровье!
Бротли, Зопфли и Гуцли
• Real-World Effectiveness of Brotli
Цена JS-фреймворков
Ведущие: Вадим Макеев, Никита Дубко, Сергей Рубанов
Темы
00:00:00 Интро
00:01:07 События
00:02:59 Новости браузеров
00:09:25 Chakra Core уходит сообществу
00:21:00 Релиз Shower 3.0
00:25:17 jQuery всё ещё нужна
00:33:09 Гитхаб подешевел
00:37:06 ES-импорты для разработки
00:45:33 Будни TC39
00:56:10 Телеграм против веба
События
• PiterJS онлайн 23 апреля
• 32 видео с FrontendConf 2019
Новости браузеров
• Flexbox & grid may soon work on fieldset elements!
• Chromium: Flexbox/grid doesn’t work on fieldset elements
• HTML5 Accessibility
• LayoutNG: Flexbox implementation
Chakra Core уходит сообществу
Релиз Shower 3.0
jQuery всё ещё нужна
• jQuery 3.5.0 Released!
• JavaScript по БЭМ
Гитхаб подешевел
• GitHub is now free for teams
• FAQ about changes to GitHub’s plans
ES-импорты для разработки
• Импорт локальных модулей на сайте The F-Word
Будни TC39
Телеграм против веба
• Juliarderity: ECMAScript, WebAssembly, Web APIs, specs
• Адвент-календарь постов про индивеб
• Webmascon Project
Ведущие: Вадим Макеев, Никита Дубко, Мария Просвирнина
Темы
00:00:00 Интро
00:00:24 Подкасты
00:06:08 События
00:07:42 Новинки браузеров
00:22:00 Формат изображений AVIF
00:30:52 Релиз WebStorm 2020.1
00:40:28 Планы на PostCSS 8.0
00:48:48 CSS-нудизм и дефолты
00:57:25 Тёмные темы
Подкасты
События
• GET PROF IT онлайн 22 апреля
• Вебинар Тимура Шемсединова по Node.js, онлайн 7, 14, 21 апреля
Новинки браузеров
• Release Notes for Safari TP 104
• Web Animations in Safari 13.1
• New in Chrome 81
• Interact with NFC devices on Chrome for Android
• Firefox 75 в обзоре Марата Таналина
• Firefox 75: Ambitions for April
Формат изображений AVIF
• AVIF image format
• Mozilla: Intent to implement AVIF
• Chromium: Support AVIF
• WebKit: AVIF decoding support
• Netflix: AVIF for Next-Gen Image Coding
Релиз WebStorm 2020.1
• Релиз WebStorm 2020.1 на Хабре
• Релиз WebStorm 2020.1 в официальном блоге
• WebStorm Bug and Issue Tracker
Планы на PostCSS 8.0
• PostCSS 8.0 is coming
• PostCSS
• Open Collective: Eleventy
• Open Collective: PostCSS
• Open Collective: Stylelint
CSS-нудизм и дефолты
• CSS Naked Day 2020
• CSS Remedy
• CSS-нудизм
Тёмные темы
• Building dark mode on Stack Overflow
• FOUDT: Flash of Unstyled Dark Theme
• Improved dark mode default styling
Ведущие: Вадим Макеев, Никита Дубко, Алексей Авдеев
Темы
00:00:00 Интро
00:01:13 События
00:04:00 Safari 13.1 и формы в Chrome
00:16:56 Определившийся ES 2020
00:27:45 Как дизайнерам учить код
00:40:24 Генератор цветовой палитры
00:47:38 Git Flow устарел
00:55:30 Видеоплееры в вебе
События
• Я.Субботник онлайн 25 апреля
• Генератор событий для календаря Веб-стандартов
Safari 13.1 и формы в Chrome
• New WebKit Features in Safari 13.1
• Updates to form controls and focus
Определившийся ES 2020
• ECMAScript 2020: the final feature set
• ES2020 Candidate
Как дизайнерам учить код
• 1. The Terminal And Text Editors
• 2. Git, HTML/CSS, Engineering Principles
Генератор цветовой палитры
• Tema. Simple palette generator
Новый синтаксис CSS-анимаций
• Proposal: Time-based Keyframe Animations
Git Flow устарел
• Пожалуйста, перестаньте рекомендовать Git Flow
• A successful Git branching model
• GitHub Flow
Видеоплееры в вебе
• Обзор видеоплееров для веба
• Better web video with AV1 codec
• Anatomy of a Web Media Experience
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:23 Подкасты
00:02:36 События
00:05:11 Safari и третьи куки
00:14:07 Safari и ваши хранилища
00:21:20 Спор про Prettier
00:33:51 Быстрые картинки
00:48:44 Старые трюки
00:59:35 Auto в CSS
Подкасты
• Podcast-list
• Undefined в Apple Podcasts
• Undefined в Яндекс.Музыке
• Undefined во ВКонтакте
События
• Geekle онлайн 2 апреля
• MinskCSS Meetup онлайн 8 апреля
• OdessaJS в Одессе 4–5 июля
Safari и третьи куки
• Upcoming Chrome and Chrome OS releases
• Chrome and Chrome OS release updates
• Full Third-Party Cookie Blocking and More
Safari и ваши хранилища
• Apple just killed Offline Web Apps
• Journal—Apple’s attack on service workers
Спор про Prettier
Быстрые картинки
• Embracing modern image formats
• Картинки как коробки — что внутри?
Старые трюки
• Maintaining Performance
• When is a lazy-loaded image “about to intersect the viewport”
Auto в CSS
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко
Темы
00:00:00 Интро
00:00:40 События
00:04:09 GitHub и npm
00:18:07 iPad с курсором
00:23:38 История URL
00:32:54 Липкие таблицы
00:40:40 Жизнь без User-Agent
00:50:30 Вёрстка писем
00:56:22 Закрывайте теги!
События
• Tver.io JavaScript Meetup в Твери онлайн 19 марта
• Видео с Я 💛 Фронтенд 2020
• Video Recording and Live Streaming for RK
• The RK Recording Tour
GitHub и npm
• GitHub Mobile
• Npm is joining GitHub
• The economics of open source
iPad с курсором
• iPad Pro Cursor with Craig Federighi
История URL
Липкие таблицы
Жизнь без User-Agent
• My findings after browsing the web without a UA header for one week
• Встречайте бабушку, Виталий Харисов
Вёрстка писем
• Good Email Code
• Punched card coding
Закрывайте теги!
• Stop using closing tags for the HTML elements
• «Не закрывайте теги!»
Ведущие: Вадим Макеев, Никита Дубко, Наташа Теплухина
Темы
00:00:00 Интро
00:01:10 Мета и подкасты
00:06:06 Отмена событий
00:14:59 Firefox обновит KaiOS
00:19:41 Ненужный CSS в DevTools
00:26:19 Такой сложный вьюпорт
00:33:18 Размеры и загрузка картинок
00:39:40 Смешивание цветов
00:44:47 Команда Vue.js Core
01:01:11 Документация и перевод
01:09:04 Планы Vue.js
Мета и подкасты
Отмена событий
• JS Fwdays онлайн в Киеве 14 марта
• IWD 2020 онлайн в Калининграде 15 марта
• KharkivCSS в Харькове осенью
• HolyJS в Питере в июне
• IT Global Meetup в Питере в июне
• Pitercss_class берёт паузу
• PiterJS не унывает
• Krasnodar Backend miniConf
• CodeFest в Новосибирске 28–29 марта
• Календарь «Веб-стандартов»
Firefox обновит KaiOS
• KaiOS Technologies and Mozilla partner
• Firefox 74
Ненужный CSS в DevTools
• When CSS doesn’t do anything
Такой сложный вьюпорт
Размеры и загрузка картинок
• Setting Height And Width On Images Is Important Again
Смешивание цветов
• When 255 × 0 does not Equal Zero
• Цветосмешение
Vue.js
• Vue.js: The Documentary
• Новый участник Vue core team
• ESLint-плагин теперь поддерживает синтаксис Vue3
• Vue’s Darkest Day
Ведущие: Никита Дубко, Мария Просвирнина, Александр Коротаев
Темы
00:00:00 Интро
00:00:57 События
00:11:39 Широкая цветовая гамма
00:15:11 Этапы развития CSS
00:20:28 Вся сборка ведёт в Rome
00:26:16 Фильм про Vue.js
00:30:59 Интернационализация
00:36:30 Юбилей Google Fonts
00:40:11 Фронтендер в геймдеве
00:58:50 Зарубежные митапы
События
• It-knot в Воронеже 12 марта
• Tver.io в Твери 19 марта
• Front-end Hero Meetup в Черкассах 19 марта
• Angular meetup #17 в Москве 23 марта
• Moscowcss №18 в Москве 24 марта
• MoscowJS 49 в Москве 26 марта
• JSNation в Амстердаме 3–5 июня
Широкая цветовая гамма
• Wide Gamut Color in CSS with Display-P3
Этапы развития CSS
• CSS Specification Timelines, Updated and Modernized
Вся сборка ведёт в Rome
• Rome, a new JavaScript Toolchain
Фильм про Vue.js
Интернационализация
• JavaScript Internationalization in 2020
Юбилей Google Fonts
• Вариативные шрифты с кириллицей
Фронтендер в геймдеве
• Создание аркадной игры на ванильном JavaScript
Зарубежные митапы
Ведущие: Алексей Симоненко, Вадим Макеев, Андрей Смирнов
Темы
00:00:00 Интро
00:01:46 События
00:07:25 Отладка перфоманса
00:12:04 Разный --save-dev
00:18:06 CSS4, продолжение
00:30:10 Мечты о CSS
00:37:51 Софт-скилы
00:46:59 Чему учить сотрудника
01:00:45 Что такое софт и хард
01:10:05 Мягкий фронтендер
События
• Я ❤ Фронтенд в Москве 29 февраля
• Pitercss_class в Питере 21 марта
• Kolesa Conf в Алматы 12 апреля
• Frontend United в Минске 30 апреля—2 мая
• Community-Z
Отладка перфоманса
• In-Browser Performance Linting With Feature Policies
Разный --save-dev
• Вы используете devDependencies неправильно
CSS4, продолжение
• В W3C появилась общественная группа по CSS4
Мечты о CSS
Софт-скилы
• Почему не надо становиться руководителем
• Карьерная трансформация софт-скилов
Ведущие: Вадим Макеев, Никита Дубко, Ольга Алексашенко, Глафира Жур
Темы
00:00:00 Интро
00:00:48 События
00:09:06 Опять гриды
00:17:25 Градиенты всё лучше
00:22:22 Блокирующий CSS
00:27:47 Веб-компоненты
00:37:49 Всё про кнопки
00:51:48 Как работает disabled
События
• Pitercss_meetup в Питере 25 февраля
• JS Meetup в Харькове 27 февраля
• Accessibility Club Minsk Meetup #1 в Минске 22 апреля
Опять гриды
• Понимание CSS Grid: Создание Grid-контейнера
• Understanding CSS Grid: Grid Lines
• Understanding CSS Grid: Grid Template Areas
Градиенты всё лучше
• While You Weren’t Looking, CSS Gradients Got Better
Блокирующий CSS
Веб-компоненты
• Веб-компоненты на сайте Леруа Мерлен
• Declarative Shadow DOM
Всё про кнопки
• Styling The Good Ol’ Button Element
• A Complete Guide to Links and Buttons
Как работает disabled
Ведущие: Вадим Макеев, Никита Дубко, Мария Просвирнина
Темы
00:00:00 Интро
00:00:51 События
00:06:24 Новинки Firefox 73
00:09:08 Angular 9 с новым сборщиком
00:14:29 Container Queries
00:24:13 Web We Want
00:36:16 Нужен ли нам CSS4
00:50:05 Как JS поедает HTML
00:59:10 Избегаем DOM Reflow
События
• PiterJS №45 в Питере 20 февраля
• OdessaFrontend #15 в Одессе 21 февраля
• MoscowJS 48 в Москве 27 февраля
• Я ❤︎ Фронтенд в Москве 29 февраля
• Frontend Panda Meetup #39 в Иннополисе 29 февраля
• Developer Circles в Москве 5 марта
• JavaScript fwdays в Киеве 14 марта
• KharkivCSS #5 в Харькове 28 марта
• Voxxed Days в Минске 31 мая
Новинки Firefox 73
Angular 9 с новым сборщиком
• Version 9 of Angular Now Available
Container Queries
Web We Want
• Building the Web We Want
• Could browsers fix more a11y problems automatically?
Нужен ли нам CSS4
Как JS поедает HTML
• Why JavaScript is Eating HTML
• Hydration
Избегаем DOM Reflow
Ведущие: Вадим Макеев, Филипп Рябчун
Темы
00:00:00 Интро
00:00:49 Ручной SVG
00:10:22 Puppeteer 2.1 с Firefox
00:15:51 И снова Yarn 2
00:23:52 Что такое TeamCity
00:33:15 Фронтенд TeamCity
00:39:05 Компоненты в Storybook
Ручной SVG
Puppeteer 2.1 с Firefox
• Playwright
• Puppeteer v2.1.0
И снова Yarn 2
Что такое TeamCity
• TeamCity
• Бета TeamCity Cloud
• Публичный сервер TeamCity
• Как использовать CI для тестирования фронтенда
Фронтенд TeamCity
Компоненты в Storybook
• Storybook
• Аддон StoryShots
• Аддон StoryShots + Puppeteer
• Аддон A11y
• Аддон Knobs
Ведущие: Вадим Макеев, Никита Дубко, Андрей Мелихов
Темы
00:00:00 Интро
00:01:18 События
00:06:52 Перфоманс: сначала или потом
00:22:01 Воркеры сложнее чем кажутся
00:39:17 Интерфейс для офлайна
00:48:36 Можно ли без JS и нужно ли
01:06:59 Чистый CSS и грязный результат
События
• SPB Frontend в Питере 6 февраля
• IT-knot в Воронеже 13 февраля
• NodeSchool в Питере 29 февраля
• HolyJS в Питере 10–11 апреля
• HolyJS в Москве 13–14 ноября
Перфоманс: сначала или потом
• Микрооптимизации производительности и JavaScript
• Performance first
Воркеры сложнее чем кажутся
• JavaScript in parallel - web workers explained
• Comlink makes WebWorkers enjoyable
Интерфейс для офлайна
• Indexing your offline-capable pages with the Content Indexing API
Можно ли без JS
• Apollo GraphQL without JavaScript
Чистый CSS и грязный результат
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:46 Подкасты
00:07:24 События
00:10:44 Новинки Safari TP
00:16:05 Новый браузер Flow
00:19:26 Уходит эра IE
00:28:56 Новости от CSSWG
00:43:39 Зачем Yarn, если npm
00:55:07 Playwright вместо Puppeteer
01:05:02 Шрифт JetBrains Mono
Подкасты
• Подборка полезных подкастов для IT-специалистов
• Запуск завтра
События
• MinskJS Meetup 7 в Минске 13 февраля
• Я ❤︎ Фронтенд в Москве 29 февраля
Новинки Safari TP
• Release Notes for Safari Technology Preview 99
• CSS Images L4: image-set
Новый браузер Flow
• New browser on the block: Flow
• Presto and WebKit at Waldemar Thranes gate 98, Oslo
Уходит эра IE
Новости от CSSWG
• Add vhc value
• CSS Values L4
• Adding Math functions to CSS
Зачем Yarn, если npm
Playwright вместо Puppeteer
Шрифт JetBrains Mono
Ведущие: Вадим Макеев, Никита Дубко
Темы
00:00:00 Интро
00:00:47 События
00:07:32 Microsoft Edge
00:14:32 Прощание с User-Agent
00:24:59 Ограничение сторонних кук
00:35:54 Коротко про Babel 7.8.0
00:39:13 Причины хостить Google Fonts
00:47:54 Зачем всё-таки HTTP/2
События
• Storm The Front Meetup 7 в Гомеле 25 января
• Pitera11y_meetup 2 в Санкт-Петербурге 28 января
• PiterJS #44 в Санкт-Петербурге 30 января
• KharkivCSS в Харькове 28 марта
• JSNation в Амстердаме 3–5 июня
• CSS Day в Амстердаме 11–12 июня
• Accessibility Club Summit в Амстердаме 13–14 июня
Microsoft Edge
• Upgrading to the new Microsoft Edge
• Web Components: Everywhere?
Прощание с User-Agent
• Intent to Deprecate and Freeze: The User-Agent string
Ограничение сторонних кук
• A path towards making third party cookies obsolete
• Privacy Community Group
Коротко про Babel 7.8.0
• Babel 7.8.0: ES 2020, .mjs config files and @babel/cli improvements
Причины хостить Google Fonts
• Should you self-host Google Fonts?
Зачем всё-таки HTTP/2
• Perf testing HTTP/1.1 vs HTTP/2 vs HTTP/2 + Server Push for REST APIs
Ведущие: Вадим Макеев, Мария Просвирнина, Никита Дубко
Темы
00:00:00 Интро
00:01:00 События
00:06:54 Новинки Firefox 72
00:20:29 Shadow Parts в Firefox
00:24:38 Новые формы в новом Edge
00:29:37 Шаблоны в сервис-воркерах
00:41:26 Плиточная раскладка на гридах
00:46:20 Ментальная модель JavaScript
События
• MoscowJS 47 в Москве 30 января
• Moscowcss №17 в Москве 6 февраля
• KharkivCSS в Харькове 28 марта
• JSNation в Амстердаме 3–5 июня
• Скидка 15% на JSNation
Новинки Firefox 72
• Firefox 72 — our first song of 2020
Shadow Parts в Firefox
• CSS Shadow Parts are coming!
Новые формы в новом Edge
• Form Controls Refresh enabled
• HTML isn’t done!
• Improving form controls in Microsoft Edge and Chromium
Шаблоны в сервис-воркерах
• Smaller HTML Payloads with Service Workers
Плиточная раскладка на гридах
• Стандарт CSS для Masonry-раскладки
Ментальная модель JavaScript
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:01:14 Оля с пожеланиями
00:04:57 Лёша с софт-скилами
00:22:13 Маша с футболом
00:26:23 Вадим без фронтенда
00:34:37 Веб-компоненты и React
00:52:09 Гриды или флексы
01:01:00 Когда перфоманс
01:12:58 Дайвёрсити
01:18:48 Веб-стандарты 2020
Лёша с софт-скилами
• DevWhatYouLove
• TeamLead Conf
Маша с футболом
• Okko Спорт
• Запуск трансляций Английской Премьер-лиги в новом формате
Вадим без фронтенда
• LP — Любимые пластинки
• Подкастерская
Веб-компоненты и React
• Igalia
• Paul Lewis — Custom Web Shadow Elements, or Whatever…
• Alex Russell — The Mobile Web: MIA
Гриды или флексы
Когда перфоманс
Ведущие: Вадим Макеев, Алексей Симоненко, Катя Климович, Александр Малинин
Темы
00:00:00 Интро
00:03:21 Console.log или debug
00:10:57 Вариативные шрифты
00:24:06 Принципы доступности
00:31:23 Новогодние акции
00:58:02 Одноразовый код
Операция «Javascripton 2020»
Console.log или debug
• Frontend Panda Meetup #35 в Москве 18 января
• Mastering JS console.log like a Pro
• Console.log — это alert на стероидах
Вариативные шрифты
• Введение в вариативные шрифты
Принципы доступности
• What a Year of Learning and Teaching Accessibility Taught Me
Новогодние акции HTML Academy
• 2019: Очень странный Новый год
• 2018: Остановили Рагнарёк
• 2017: Победа над Витахультом
• 2016: Новогодняя гонка
• 2015: Первая новогодняя акция
Ведущие: Ольга Алексашенко, Вадим Макеев, Дмитрий Андриянов
Темы
00:00:00 Интро
00:01:50 Отсутствие событий
00:02:56 Что не так с HTML
00:29:09 Что можно с этим сделать
00:42:07 ШРИ Яндекса
Отсутствие событий
• Убирает старые даты Frontendconf
Что не так с HTML
• Why details is Not an Accordion
• Panels and Panel Sets Extension
Что можно с этим сделать
• Browsers are very hesitant to invest any time in the controls
• Scraping Burned Toast
• HTML is a living language
ШРИ Яндекса
Ведущие: Вадим Макеев, Кир Белевич, Максим Иванов, Роман Прудников
Темы
00:00:00 Интро
00:02:34 События вообще и в Швеции
00:18:30 Идея стандарта MapML
00:28:48 И снова WebAssembly
00:39:42 Зачем фронтендеру Docker
00:49:18 Красивый код и быстрый код
01:02:26 Жизнь айтишника в Швеции
Кир, Максим, Роман
• Кир в Твиттере
• Максим в Твиттере
• Роман в Твиттере
События вообще и в Швеции
• Msk Vue.js Meetup #6 в Москве 19 декабря
• FikaJS
Идея стандарта MapML
И снова WebAssembly
• W3C brings a new language to the Web
• A Real-World Benchmark of WebAssembly vs. ES6
Зачем фронтендеру Docker
• Docker для фронтендера. Часть 1. Зачем?
Красивый код и быстрый код
• The unseen perf costs of CSS-in-JS in React apps
• JavaScript component-level CPU costs
Ведущие: Вадим Макеев, Саша Шинкевич, Никита Дубко
Темы
00:00:00 Интро
00:01:02 События
00:11:25 10 лет фронтенда на графике
00:13:59 Новинки Firefox 71
00:26:32 WASM 4-й язык веба
00:33:39 Лёгкая вставка YouTube
00:38:54 Доступный кастомный селект
00:43:11 Экономия трафика в CSS
00:49:26 Ненавязчивая реклама
00:53:16 WSD всё
События
• SEMrush IT meetup #2 в Питере 11 декабря
• KazanJS #9 в Казани 12 декабря
• BEMup в Казани 13 декабря
• SPBfiller JS Meetup #2 в Питере 14 декабря
• OdessaFrontend #14 в Одессе 18 декабря
• Последний WSD в Минске 7 декабря
10 лет фронтенда на графике
• Больше 10 лет фронтенда
• Репозиторий на Гитхабе
Новинки Firefox 71
• Firefox 71: A year-end arrival
• Firefox 71
WASM 4-й язык веба
• WebAssembly becomes a W3C Recommendation
• Как мы внедряли WebAssembly в Яндекс.Картах и почему оставили JS
Лёгкая вставка YouTube
Доступный кастомный селект
• Making a Better Custom Select Element
Экономия трафика в CSS
• Proposal: prefers-reduced-data
Ненавязчивая реклама
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:27 События
00:03:29 Новый браузер Flow
00:09:47 Lighthouse CI
00:14:25 Сабгриды
00:20:50 Лишний CSS
00:34:10 Элемент details
00:42:58 State of JS 2019
00:44:44 Use strict
00:51:36 JS кусается
События
• Moscowcss 16
• AngularPiter #3
• The Rolling Scopes #60
• MoscowJS 46
• Undefined Meetup
• React Day Berlin
• Chernivtsi.min.js #5
• dotJS в Париже 5 декабря
• WSD в Минске 7 декабря
• PiterJS #43 в Питере 17 декабря
• Pitercss_class №13 в Питере 21 декабря
Новый браузер Flow
• Flow Browser
• Brand new layout and rendering engines + SpiderMonkey for JS
Lighthouse CI
Сабгриды
• Use CSS Subgrid to layout full-width content stripes
Лишний CSS
• Как вы избавляетесь от неиспользуемого CSS-кода? Часть 1
• Как вы избавляетесь от неиспользуемого CSS-кода? Часть 2
Элемент details
State of JS 2019
Use strict
• Зачем в JavaScript нужен строгий режим?
JS кусается
• When JavaScript Bytes
• Слайды
• Все видео с performance.now()
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:24 События
00:05:51 Исправление в Safari TP
00:11:37 Будущее сервис-воркеров
00:29:22 Node.js с ES-модулями
00:32:02 Async === Promise
00:33:44 Optional Chaining
00:41:05 Кастомные CSS-свойства
События
• GDG DevFest Gorky в Нижнем Новгороде 15–16 ноября
• Alfa JS MeetUP #3 в Москве 26 ноября
• Pitercss_meetup №35 в Питере 27 ноября
• Ember.js NN Meetup #2 в Нижнем Новгороде 29 ноября
• AngularPiter #3 в Питере 4 декабря
• Undefined Meetup в Питере 5 декабря
• WSD в Минске 7 декабря
• Видео с CSS-Minsk-JS в Минске
Исправление в Safari TP
• Release Notes for Safari Technology Preview 96
• Firefox Promise.any
• Intent to Ship
Будущее сервис-воркеров
Node.js с ES-модулями
• Announcing core Node.js support for ECMAScript modules
Async === Promise
• Разница между async функцией и возвращающей промис
Optional Chaining
• Производительность optional chaining в JS
Кастомные CSS-свойства
• CSS Variables With Inline Styles
• CSS Custom Properties In The Cascade
• Маленькие хитрости кастомных свойств
Ведущие: Вадим Макеев, Олег Соломка
Темы
00:00:00 Интро
00:01:47 События
00:05:24 Chrome Dev Summit
00:18:43 GitHub Universe
00:30:35 Снимок веба 2019
00:44:35 Большой релиз GSAP 3
00:48:52 Семейство Visual Studio
Олег Соломка
События
• SPB Frontend в Питере 19 ноября
• Pitercss_class в Питере 23 ноября
• Pitercss_meetup в Питере 27 ноября
• UI meetup #2 в Саратове 27 ноября
• CDS19 Extended в Москве 27 ноября
Chrome Dev Summit
• Все видео с Chrome Dev Summit
• CDS perf announcements you have to know
• React Adaptive Loading Hooks & Utilities
• Intent to Explain: Demystifying the Blink Shipping Process
GitHub Universe
• GitHub for mobile, GitHub Archive Program, etc.
Снимок веба 2019
• Web Almanac 2019
• WA: JavaScript
• WA: CSS
• WA: Markup
• JS Foundation
Большой релиз GSAP 3
Семейство Visual Studio
• Announcing Visual Studio Online Public Preview
• Лэндинг VS Online
• Сервис VS Online
• Демо VS Online на Ignite 2019
• VS Online на Гитхабе
• Расширение Live Share
• Введение в Live Share
• Live Share на Гитхабе
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:05:12 События
00:08:24 Готовность к Edge
00:16:12 WebKit 2020
00:21:58 Доступность и закон
00:29:22 Проверка доступности
00:42:35 WeakMap и GC
Интро
• Smashing Podcast
• Новый сайт «Веб-стандартов»
События
• MacPaw Tech Talks в Киеве 14 ноября
• Moscow Node.js Meetup в Москве 20 ноября
• Msk Vue.js Meetup #5 в Москве 21 ноября
• Ok.tech Frontend Meetup #2 в Питере 26 ноября
• AngularMoscow #16 в Москве 28 ноября
• Kolesa Frontend Meetup в Алма-Ате 28 ноября
• MoscowJS 46 в Москве 5 декабря
• Chernivtsi.min.js #5 в Черновцах 7 декабря
• WSD в Минске 7 декабря
Готовность к Edge
• Getting your sites ready for the new Microsoft Edge
WebKit 2020
Доступность и закон
Проверка доступности
• Помимо автоматизированного тестирования доступности
• W3C Validator
• HTMLMinifier
• WCAG 2.0 по-русски
WeakMap и GC
• Inside V8: weak collections, ephemerons, and private fields
• Канал Рубанова в Телеграме
Ведущие: Вадим Макеев, Сергей Куликов
Темы
00:00:00 Интро
00:01:48 События
00:09:29 Релиз Node.js и модули
00:18:04 Новые формы в Edge
00:29:24 Ленивая загрузка в Chrome
00:34:43 Safari и delegatesFocus
00:40:02 Состояние веб-компонентов
01:12:45 Будущее веб-компонентов
События
• Sber X + RamblerFront& Meet Up в Москве 5 ноября
• DUMP в Казани 8 ноября
• HolyJS в Москве 8–9 ноября
• PiterJS #42 в Питере 14 ноября
• GDG DevFest Gorky в Нижнем Новгороде 15–16 ноября
• RND.JS #9 в Ростове-на-Дону 16 ноября
• AstanaJS #4 в Нур-Султане 16 ноября
• EPAM ITnight: Java + Frontend в Тольятти 16 ноября
• Frontend Panda Meetup #31 в Москве 20 ноября
• Krasnodar Frontend miniConf в Краснодаре 23 ноября
• DevFest Siberia в Новосибирске 29 ноября—1 декабря
• Moscowcss 16 в Москве 3 декабря
• Rolling Scopes #60 в Ташкенте 5 декабря
• WSD в Минске 7 декабря
• KharkivCSS #5 в Харькове 28 марта
• FrontendConf в Москве 19–20 марта
• FrontendConf на РИТе в Москве 25–26 мая
• FrontendConf в Питере 5 августа
• FrontendConf в Новосибирске 11 декабря
Релиз Node.js и модули
• Node.js Code+Learn в Москве 6 ноября
• Node.js 12 to LTS and Node.js 13 is here!
• Consensus to unflag ESM in Node.js core
Новые формы в Edge
• Улучшения в Microsoft Edge на Chromium
Ленивая загрузка в Chrome
• Automatically lazy-loading images & iframes for Lite mode users
Safari и delegatesFocus
• Release Notes for Safari Technology Preview 95
• WHATWG: Focusing on focus
Состояние веб-компонентов
• Custom Elements Everywhere
• Why I don’t use web components
• Vaadin
Будущее веб-компонентов
• CSS Shadow Parts
• Form associated Custom Elements
• Custom :state pseudo class
Ведущие: Vadim Makeev, Rachel Andrew
Темы
00:00:00 Интро
00:05:52 Web standards work
00:15:41 CSS multi-column
00:21:50 CSS for printing
00:27:41 New display values
00:36:34 Contributing
Rachel Andrew
• Rachel on Twitter
• Blog
• Perch
• Notist
• When and how to use CSS multi-column layout
• Mistakes in the design of CSS
• W3C current members
Digging into the display property
• The Two Values Of Display
• Grids All The Way Down
• Box Generation
Ведущие: Vadim Makeev, Andy Bell
Темы
00:00:00 Интро
00:03:52 CSS passion
00:12:27 Every Layout
00:16:22 Why Sass
00:25:24 Owls or gaps?
00:32:23 Container Queries
00:36:57 BEM variations
Andy Bell
• Andy on Twitter
• Blog
• Every Layout
• Managing Flow and Rhythm with CSS Custom Properties
Ведущие: Vadim Makeev, Andreas Bovens
Темы
00:00:00 Интро
00:03:09 GeckoView
00:20:39 Firefox DevTools
00:24:52 Firefox on mobile
00:30:06 Mozilla vs Opera
00:39:26 Why not Chromium?
00:44:20 Why Firefox?
Andreas Bovens
• Andreas on Twitter
• GeckoView
• Firefox Preview
• Puppeteer for Firefox
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:01:15 Мета
00:04:46 События
00:10:36 Sass оказывается жив
00:28:44 Динамические компоненты без JS
00:35:10 Новый взгляд на сброс стилей
00:46:20 Очень странный CSS
Мета
• Репозиторий сайта
• Дизайн сайта в Figma
События
• Pitercss_meetup №34 в Питере 16 октября
• WSD в Екатеринбурге 19 октября
• Я.Субботник в Москве 26 октября
• Moscowcss_15 в Москве 29 октября
• JavaScript Party в Новосибирске 30 октября
• #ITsubbotnik Autumn в Москве 2 ноября
• Global Day of Coderetreat во Львове 16 ноября
• Accessibility Club Summit в Берлине 16 ноября
• SmashingConf в Сан-Франциско 21–22 апреля
• SmashingConf в Остине 9–10 июня
• SmashingConf во Фрайбурге 7–8 сентября
Sass оказывается жив
• The Module System is Launched
• Профессиональный HTML и CSS, уровень 2
Динамические компоненты без JS
• Dynamic CSS Components Without JS
Новый взгляд на сброс стилей
• A Modern CSS Reset
• Reset.css
• Normalize.css
Очень странный CSS
Ведущие: Vadim Makeev, Léonie Watson
Links
• Léonie on Twitter
• Blog
• FrontendConf in Moscow on October 13-14
• Web Components and the AOM
• Accessibility Support
10% discount for FrontendConf with FC+WST promocode.
Ведущие: Vadim Makeev, Eva Ferreira, Ian Pouncey
Темы
00:00:00 Интро
00:00:19 Eva Ferreira
00:22:36 Ian Pouncey
Eva Ferreira
Ian Pouncey
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:01:23 События
00:07:02 Бета Chrome 78 и iOS 13
00:22:40 Сгибание на React
00:30:45 Экономная оптимизация
00:37:34 Вариативные Google Fonts
00:40:21 Прокси и jQuery
События
• SPB Frontend в Питере 8 октября
• PiterJS №41 в Питере 10 октября
• OdessaFrontend #13 в Одессе 10 октября
• FrontendConf в Москве 13–14 октября
• РИФ в Воронеже 18–19 октября
• GDG DevFest в Москве 9 ноября
• DartUP в Питере 23 ноября
Бета Chrome 78 и iOS 13
• Chrome 78 Beta
• iPhone 11, iPadOS and iOS 13 for PWAs and web dev
Сгибание на React
Экономная оптимизация
• Automatically compress images on Pull Requests
Вариативные Google Fonts
• Fonts — a dish best served variable
Прокси и jQuery
• Chaining styles with a JavaScript Proxy
• История и наследие jQuery
Ведущие: Vadim Makeev, Eric Meyer, Max Böck
Темы
00:00:00 Интро
00:00:22 Eric Meyer
00:37:30 Max Böck
Eric Meyer
• Eric on Twitter
• Blog
• CSS: The definitive guide, 4th edition in Russian
Max Böck
Ведущие: Вадим Макеев, Света Шарипова, Татьяна Фокина
Темы
00:00:00 Интро
00:01:17 Мета
00:04:09 События
00:10:08 Новинки Chrome 77
00:15:56 Can I use + MDN
00:24:48 Can I email?..
00:30:28 Митап по доступности
Мета
• Репозиторий сайта
• Дизайн сайта в Figma
События
• WSD в Екатеринбурге 19 октября
• Pitera11y_meetup в Питере 24 сентября
• Tver.io Frontend Meetup в Твери 26 сентября
• WebDev Trends в Москве 27 сентября
Новинки Chrome 77
Can I use + MDN
• Caniuse and MDN compatibility data collaboration
Can I email?..
Митап по доступности
• Pitera11y_meetup 1
• Разработка доступных интерфейсов
• Создание доступных уведомлений, алертов
• Разработка доступных графиков
• Drag&Drop-компоненты для слепых пользователей
Ведущие: Вадим Макеев, Дмитрий Сазонов, Алексей Орлов
Темы
00:00:00 Интро
00:03:56 События
00:10:04 Новинки Firefox 69
00:15:02 Советы WebKit по перфомансу
00:24:04 File API и чего не хватает
00:31:39 Якорь к контенту
00:39:01 Что такое Chatix
00:56:45 Трансляция экрана
01:18:34 Будущее проекта
События
• Undefined Meetup в Питере 17 сентября
• LongestJS в Питере 21 сентября
Новинки Firefox 69
Советы WebKit по перфомансу
• How Web Content Can Affect Power Usage
File API и чего не хватает
• Native File System API: Simplifying access to local files
Якорь к контенту
• WICG: Scroll-To-Text using a URL fragment
Что такое Chatix
• Chatix
• SignalR
• Руководство для разработчиков
• SDK Chatix Core в npm
Трансляция экрана
• Демонстрация экрана в действии
• Chatix на Гитхабе
Будущее проекта
• Дмитрий Сазонов в Телеграме
• Дмитрий Сазонов во ВКонтакте
• Почта для вопросов — [email protected]
• Промокод на 500 ₽ — WEBSTANDARDS
Ведущие: Ольга Алексашенко, Вадим Макеев, Евгений Плотников
Темы
00:00:00 Интро
00:02:47 Италия и конкурсы
00:06:55 События
00:10:17 Уже бета Edge
00:20:34 Vue и Material Design
00:32:43 Доступность
00:35:55 Реклама в npm
00:41:39 От сварщика до программиста
События
• Facebook Developer Circle в Москве 10 сентября
• AngularMoscow #15 в Москве 11 сентября
• Frontend meetup meta/conf в Воронеже 14 сентября
• Видео с Moscow Vue.js Meetup #3
Уже бета Edge
• Introducing Microsoft Edge Beta
Vue и Material Design
Доступность
• How to Accessibly Split Text
Реклама в npm
• Npm bans terminal ads
• Supporting Open Source Maintainers
• Recap of the funding experiment
Ведущие: Вадим Макеев, Дмитрий Махнёв, Сергей Рубанов
Темы
00:00:00 Интро
00:01:17 События
00:11:25 Google и приватность
00:20:38 JavaScript в вузах
00:32:04 WebAssembly
00:46:52 Люди из TC39
01:00:07 Участие в создании ES
События
• TechTrain в Питере 24–25 августа
• ngУжин в Питере 29 сентября
• Ember.js NN Meetup #1 в Нижнем Новгороде 30 августа
• Armada JS в Нови-Сад, Сербия 19–20 сентября
• Chrome DevSummit в Сан-Франциско 11–12 ноября
Google и приватность
• Building a more private web
• Имя — это фича, Виталий Худобахшов
JavaScript в вузах
• Основы программирования с примерами на JS
• Learnable Programming
• Wallaby.js & Quokka.js, Дмитрий Махнёв
WebAssembly
• WebAssembly Interface Types: Interoperate with All the Things!
Люди из TC39
• TC39 Committee at JSConf EU
• Nicolò Ribaudo
• Michael Saboff
• Julia Startsev
• Aki Rose Braun
• Канал Juliarderity
Участие в создании ES
Ведущие: Мария Просвирнина, Павел Ловцевич, Анна Селезнёва, Никита Дубко
Темы
00:00:00 Интро
00:01:27 События
00:06:12 MathML в Chrome (и дальше)
00:10:41 Ленивые картинки в Chrome
00:21:36 Поворот картинки в CSS
00:24:31 Нативные CSS-модули
00:27:47 БЭМ или CSS-in-JS
00:40:59 Зачем нужны основы
00:45:11 Манифест приватности
00:53:43 CSS-Minsk-JS
События
• I think Frontend в Москве 21 августа
• Alfa JS MeetUP SPb в Питере 22 августа
• Moscow Vue.js Meetup #3 в Москве 22 августа
• Special 🗽AngularNYC meetup в Москве 22 августа
• PenzaJs + Panda meetup в Пензе 24 августа
• TechTrain в Питере 24–25 августа
• Krasnodar Dev Conf в Краснодаре 24–25 августа
• CSS-Minsk-JS в Минске 20–21 сентября
MathML в Chrome (и дальше)
• MathML in Chromium: Project status
Ленивые картинки в Chrome
• Native lazy-loading for the web
Поворот картинки в CSS
• Consider changing initial value of image-orientation to from-image
Нативные CSS-модули
• Chrome: Intent to Implement: CSS Modules v1
БЭМ или CSS-in-JS
• CSS vs CSS-in-JS (BEM vs Emotion)
Зачем нужны основы
Манифест приватности
• Mozilla: Security/Anti tracking policy
• WebKit Tracking Prevention Policy
CSS-Minsk-JS
• CSS-Minsk-JS
• Промокод WebStandardsLoveMinsk на 10%
Ведущие: Вадим Макеев, Вадим Горбачёв, Дмитрий Пацура
Темы
00:00:00 Интро
00:10:20 Доступ к адресной книге в Chrome
00:16:46 JS-движок Hermes для React Native
00:29:17 Инструменты: PageSpeed, DevTools, ndb
00:47:31 Зачем Puppeteer, если WebDriver
00:58:37 PiterJS: митап и конференция
Мета
События
• PiterJS №40 в Питере 16 августа
• SPA Meetup #5 в Москве 17 августа
• MSK VUE.JS MEETUP #2 в Москве 18 августа
• I think Frontend в Москве 21 августа
• Moscow Vue.js Meetup #3 в Москве 22 августа
• PiterJS conf в Питере 7 сентября
• Стачка в Иннополисе 12–13 октября
Доступ к адресной книге в Chrome
• A Contact Picker for the Web
• Fugu API tracker
JS-движок Hermes для React Native
Инструменты: PageSpeed, DevTools, ndb
• Как работает Google PageSpeed
• I’ve officially left the V8 to work on DevTools
• Ndb: DevTools для Node.js
Зачем Puppeteer, если WebDriver
PiterJS: митап и конференция
Ведущие: Vadim Makeev, Bruce Lawson
Темы
00:00:00 Интро
00:09:36 HTML semantics use cases
00:17:41 Web Components and semantics
00:22:03 W3C and WHATWG
00:28:42 HTML5 Doctor
00:35:50 Accessible PDF with Prince XML
00:49:22 Web Monetization API
HTML semantics use cases
• The practical value of semantic HTML
• Semantic for cynics
Web Components and semantics
• Léonie Watson using screen reader
• Web Components and the AOM
W3C and WHATWG
• HTML 5.2 W3C Recommendation
• HTML Living Standard by WHATWG
HTML5 Doctor
Accessible PDF with Prince XML
Web Monetization API
• Web Monetization API proposal
• Payment Pointers
• Coil
• Swordcello
Ведущие: Вадим Макеев, Мария Просвирнина, Андрей Складчиков
Темы
00:00:00 Интро
00:01:54 События
00:12:53 Новинки Firefox
00:19:31 Удобно читать JSON
00:24:27 Книга и спор про CSS
00:37:38 Компоненты в монорепе
00:50:00 A11y: тултипы, AOM, ссылки
00:57:16 Slack и ответственный JS
События
• IT Nights в Иннополисе 1–3 августа
• WebAssembly Moscow meetup #2 1 августа
• VinnytsiaJS в Виннице 3 августа
• Rolling Scopes Conference в Минске 9–11 августа
• Special AngularNYC meetup в Москве 22 августа
• Krasnodar Dev Conf в Краснодаре 24–25 августа
• PenzaJs + Panda meetup в Пензе 24 августа
• PiterJS conf в Питере 7 сентября
• Фестиваль 404 в Самаре 14–15 сентября
• FrontendConf в Москве 13–14 октября
• FrontDays в Тольятти 26 октября
• LvivCSS во Львове 2 ноября
• JS Fest в Киеве 8–9 ноября
Новинки Firefox
Удобно читать JSON
• JsonDiscovery: Меняем опыт просмотра JSON в браузере
Книга и спор про CSS
Компоненты в монорепе
• Общие компоненты Яндекса силами разных команд
• Библиотека компонентов Ivi
A11y: тултипы, AOM, ссылки
• Инклюзивные компоненты: тултипы и тоглтипы
• Meaning without markup: Accessibility Object Model
• The accessibility of placeholder links
Slack и ответственный JS
• Rebuilding Slack on the desktop
• Ответственный подход к JS-разработке, 1
• Ответственный подход к JS-разработке, 2
Ведущие: Вадим Макеев, Мария Просвирнина, Сергей Фролов, Никита Дубко
Темы
00:00:00 Интро
00:02:06 BeerJS Summit
00:31:07 Альтернативные форматы
00:50:27 Дружба народов
BeerJS Summit
Альтернативные форматы
• Zlit
• SPB Frontend
Дружба народов
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:03:55 10 лет Web Standards Days
00:23:48 Самое важное за полгода
00:30:21 Ответы на вопросы из зала
10 лет Web Standards Days
• WSD в Москве в 2010 году
• Статья Оли «Как воспитать дизайнера»
Самое важное за полгода
• Microsoft Edge and Chromium Open Source: Our Intent
• The new evergreen Googlebot
Ответы на вопросы из зала
Ведущие: Вадим Макеев, Кирилл Роговой
Темы
00:00:00 Интро
00:03:48 События
00:10:23 Sass и кастомные свойства
00:22:03 Стратегия загрузки шрифтов
00:32:12 Безусловный JS
00:41:42 Веб-компоненты
00:51:02 Всё про WebRTC
События
• RamblerFront& #7 в Москве 11 июля
• WSD в Питере 13 июля
• OdessaJS в Одессе 20–21 июля
• BeerJS Summit в Минске 20 июля
• Moscowcss #14 в Москве 25 июля
• Krasnodar Dev Conf в Краснодаре 24–25 августа
• YaTalks в Екатеринбурге 14 сентября
Sass в SPA
Кастомные свойства
• CSS Custom Properties In The Cascade
Стратегия загрузки шрифтов
• Developing a Robust Font Loading Strategy for CSS-Tricks
Безусловный JS
• Советы по улучшению условий в JavaScript
Веб-компоненты
• Почему я не использую веб-компоненты
Всё про WebRTC
• Wish Firefox and WebKit would fix their WebRTC
• How Zoom’s web client avoids using WebRTC
• Блог Skyeng на Хабре
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:02:46 События
00:11:23 Node.js, npm, JetBrains
00:26:02 Сервис-воркеры и WebAssembly
00:36:32 Цена JS и виртуальный список
00:46:32 Как понять современный CSS
00:57:09 Фокус и доступные псевдоэлементы
Мета
• «Веб-стандарты» на Патреоне
• LP — новый подкаст про музыку
• Код сайта LP на Гитхабе
События
• Pitercss_meetup
• Календарь событий по фронтенду
• Ok.tech Frontend Meetup в Питере 2 июля
• EPAM JavaScript Meetup в Питере 4 июля
• Panda Frontend Meetup в Москве 6 июля
• WSD в Питере 13 июля
• Я.Субботник в Питере 20 июля
• BeerJS Summit в Минске 20 июля
• IT Nights в Иннополисе 1–3 августа
Node.js, npm, JetBrains
• Node 12.5.0
• The economics of open source
• JetBrains Open Day
• Видео доклада IDE Wars
Сервис-воркеры и WebAssembly
• Bringing service workers to Google Search
• WebAssembly brings Google Earth to more browsers
Цена JS и виртуальный список
• The cost of JavaScript in 2019
• Virtualize large lists with react-window
Как понять современный CSS
• Refactoring (the way we talk about) CSS
Фокус и доступные псевдоэлементы
• Intent To Ship: Alternative Text for CSS Generated Content
• CSS Content: Alternative Text for Accessibility
• Indicating focus to improve accessibility
Ведущие: Ольга Алексашенко, Вадим Макеев, Анатолий Кукаев
Темы
00:00:00 Интро
00:01:40 События и Panda Meetup
00:16:45 Бета Chrome 76
00:20:24 Доступные уведомления
00:30:32 Тост и стандарты
00:39:13 Препроцессоры (не) нужны
00:56:12 jQuery (не) нужна
События и Panda Meetup
• Panda Frontend Meetup #19 в Москве 26 июня
• Panda Node.js Meetup #20 в Москве 27 июня
• QIWI JS Detox в Москве 26 июня
• AngularMoscow #14 в Москве 27 июня
• SmartMail Meetup в Москве 27 июня
• JSNN #13 в Нижнем Новгороде 29 июня
• EPAM JavaScript Meetup в Питере 4 июля
• Msk Vue.js Meetup #1 в Москве 18 июля
• PenzaJs + Panda meetup в Пензе 24 августа
• FrontendConf в Москве 3 октября
• Intercom Vue.js в Москве 14 октября
Бета Chrome 76
• Chrome 76 Beta: dark mode, payments, new PWA features and more
Доступные уведомления
• Создание доступных уведомлений, алертов и других элементов
Тост и стандарты
• Intent to Implement: Toast UI element
• A Standard Toast UI Element
• Introducing the new HTML element. Welcome clippy
• Toast
Препроцессоры (не) нужны
• Нужны ли препроцессоры в 2019 году
jQuery (не) нужна
Ведущие: Вадим Макеев, Мария Просвирнина, Татьяна Фокина
Темы
00:00:00 Интро
00:01:23 Конкурс и раздача
00:04:15 События
00:08:36 Chrome и Safari
00:22:37 Новости TC39
00:33:32 Сторонние ресурсы
00:47:56 Подгриды
00:52:54 Доступность
Конкурс и раздача
• Почта [email protected]
• «Веб-стандарты» на Патреоне
События
• BEMup в Москве 14 июня
• Moscowcss №13 в Москве 18 июня
• PiterJS №38 в Питере 20 июня
• Panda Meetup по Node.js в Москве 27 июня
• Ok.tech Frontend Meetup в Питере 2 июля
• WSD в Питере 13 июля
• Список CityJS
Chrome и Safari
• New in Chrome 75
• Safari 13 Beta Release Notes
• Introducing Desktop-class Browsing on iPad
• Audits in Web Inspector
• Auditing Web Content with Web Inspector
Новости TC39
• ES2020
• Dynamic import
• Top-level await
• WeakReferences
Сторонние ресурсы
• Self-Host Your Static Assets
Подгриды
• CSS Subgrid новости
• Hello Subgrid!
Доступность
Ведущие: Vadim Makeev, Chris Mills
Темы
00:00:00 Интро
00:00:51 Fx or FF, Mozilla, why Firefox
00:09:26 Switching to Firefox, DevTools
00:16:38 MDN as the web platform’s Wikipedia
00:25:05 How and why contribute to MDN
00:31:36 Specs and docs translation
00:37:52 MDN’s future: GitHub, Markdown
Links
• Chris on Twitter
• MDN Web Docs
• MDN Product Advisory Board
• MDN Data
• Dash
• DevDocs
• CSSTree
Ведущие: Вадим Макеев, Александра Боровова, Андрей Кузьмин
Темы
00:00:00 Интро
00:07:20 События
00:18:18 W3C + WHATWG = HTML
00:21:07 SEO без мифов
00:28:23 Бюджет быстродействия
00:40:18 Фильм про Ember.js
00:43:22 Зачем Elm
00:51:05 Расширение для Puppeteer
Интро
• Андрей в Твиттере
• Александра в Твиттере
• «Веб-стандарты» на SoundCloud
• Frontend Engineer at SoundCloud
События
• CSSconf в Берлине 31 мая
• JSConf в Берлине 1–2 июня
• ReactRussia: конкурс на новое название
• BeerJS Summit в Минске 22 июля
• Календарь «Веб-стандартов» теперь в JSON
W3C + WHATWG = HTML
• W3C и WHATWG: неужели долгожданный мир?
SEO без мифов
• SEO Mythbusting, Episode 1
• SEO Mythbusting, Episode 2
Бюджет быстродействия
• Your first performance budget with Lighthouse
• Calibre
• Бен Шварц в Твиттере
• Видео с Chrome Dev Summit
Фильм про Ember.js
• Ember.js: The Documentary
• JSConf EU 2019 Opening
• JSConf EU 2017 Opening
Зачем Elm
• Elm
• The Elm Guide
• Elm Berlin Meetup
• Игрушки на Elm
Расширение для Puppeteer
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:42 Патреон и подкасты
00:04:46 События
00:12:22 Edge, Firefox, Blink
00:28:10 Font-display в Google Fonts
00:40:02 Иконочные шрифты
00:45:16 Формы и клавиатура
00:51:14 Доступные меню и кнопки
Патреон и подкасты
• Патреон «Веб-стандартов»
• Подкасты про веб-разработку
События
• HolyJS в Питере 24–25 мая
• Frontend Conf в Москве 27–28 мая
• JavaScript Party в Новосибирске 30 мая
• CSSconf в Берлине 31 мая
• JSConf в Берлине 1–2 июня
• React Russia в Москве 1 июня
• ReactRussia в Выборге 22 июня
• FED meetup #1 в Днепре 1 июня
• Tver.io Girl Power Meetup в Твери 13 июня
• Ember.js Meetup #4 в Питере 14 июня
Edge, Firefox, Blink
• Microsoft Edge preview builds for macOS
• Firefox 67
• CSS Grid subgrid lands in Firefox Nightly
• Blink LayoutNG
Font-display в Google Fonts
• Google Fonts is Adding font-display
• Monica’s font-display explainer
Иконочные шрифты
• Font-display is Incompatible with icon fonts
Формы и клавиатура
• Everything You Ever Wanted to Know About inputmode
Доступные меню и кнопки
• Инклюзивные компоненты: меню и кнопки меню
• Accessible Icon Buttons
• Contextually Marking up accessible images and SVGs
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:55 Мета-мета
00:05:44 События
00:16:05 Вечнозелёный Гугл-бот
00:26:47 Font-display в Google Fonts
00:32:33 Перфоманс и порталы
00:42:02 Более нативный веб
00:49:13 Тестирование и Puppeteer
00:57:07 IE в Edge и реестр GitHub
Мета-мета
• Подкасты наступают
• Podcasts Repo
• Подкасты про веб-разработку
События
• PiterJS в Питере 20 мая
• Pitercss_meetup в Питере 21 мая
• CyprusJS на Кипре 23 мая
• BEMup в Москве 24 мая
• HolyJS в Питере 24–25 мая
• Simferopol Frontend в Симферополе 25 мая
• Node.js Code+Learn в Питере 26 мая
• JavaScript EVENING в Питере 29 мая
• Ok.tech Frontend Meetup в Питере 4 июня
• AstanaJS в Нур-Султане 15 июня
• ReactRussia в Выборге 22 июня
• Panda Frontend Meetup в Москве 6 июля
• Krasnodar Dev Conf в Краснодаре 24–25 августа
Вечнозелёный Гугл-бот
• What’s new with Chrome and the Web
• Web at Google I/O 2019
• The new evergreen Googlebot
Font-display в Google Fonts
• Google Fonts supports font-dispay
Перфоманс и порталы
• Lighthouse Performance Budgets
• Hands-on with Portals: seamless navigations on the Web
Более нативный веб
Тестирование и Puppeteer
• Puppeteer Docs
• Modern Web Testing and Automation with Puppeteer
IE в Edge и реестр GitHub
• React Native for Windows
• Microsoft Edge: All the news from Build 2019
Ведущие: Vadim Makeev, Greg Whitworth
Темы
00:00:00 Интро
00:00:35 Google I/O
00:02:37 IE mode in Edge
00:11:17 Edge engine switch
00:15:05 Chromium project
00:19:46 Why CSS is slow
00:23:27 Our voice in CSSWG
00:27:44 Stages in CSS
00:36:19 New CSS via Houdini
Greg Whitworth
Google I/O
IE mode in Edge
• Microsoft Build 2019
• Edge news from Build
Edge engine switch
• Inside Microsoft’s decision to work with Google on Edge
Chromium project
• Chromium
Why CSS is slow
• CSSWG on Twitter
• CSSWG Editor Drafts
Our voice in CSSWG
• Web Developer Representation in W3C
Stages in CSS
New CSS via Houdini
Ведущие: Вадим Макеев, Мария Просвирнина, Андрей Ситник
Темы
00:00:00 Интро
00:01:20 События
00:14:25 Бета Chrome 75
00:22:05 Год со Spectre
00:35:31 История slot
00:40:44 Svelte и Parcel
00:52:50 Загрузка шрифтов
01:00:38 Инди-опенсорс
01:20:18 PostCSS и Logux
События
• Tver.io Open-Source Meetup в Твери 10 мая
• MoscowCSS #12 в Москве 14 мая
• WebAssembly Meetup в Москве 16 мая
• KazanJS в Казани 16 мая
• ITSubbotnik в Твери 18 мая
• MinskJS Meetup в Минске 23 мая
• HolyJS в Питере 24–25 мая
• Frontend Conf в Москве 27–28 мая
• ReactRussia #2 в Выборге 22 июня
• BeerJS Summit в Минске 20 июля
• OdessaJS в Одессе 20–21 июля
• CSSCamp в Барселоне 17 июля
• JSCamp в Барселоне 18–19 июля
• VinnytsiaJS в Виннице 3 августа
• SmashingConf во Фрайбурге 9–10 сентября
• Фестиваль 404 в Самаре 21–22 сентября
• Fronteers в Амстердаме 3–4 октября
Бета Chrome 75
• Chrome 75 Beta
• Picture-in-Picture for arbitrary content
Год со Spectre
История slot
• A history of the HTML slot element
Svelte и Parcel
• Svelte 3.0
• Using Parcel as a Bundler for React Applications
Загрузка шрифтов
• Progressive Font Enrichment: reinventing web font performance
Инди-опенсорс
• Storeon
• Nanoid
• Size Limit
PostCSS и Logux
Ведущие: Вадим Макеев, Виктор Суздалев, Денис Ильин
Темы
00:00:00 Интро
00:02:20 События в Ростове-на-Дону
00:16:12 Новинки Chrome 74
00:26:18 Node.js 12 и ES-модули
00:30:29 Svelte 3
00:37:02 Борьба с оптимизациями V8
00:42:49 Пространственная навигация
00:48:30 PWA в Google Play
События в Ростове-на-Дону
• TradingView A11y Meetup в Ростове-на-Дону 26 апреля
• Календарь событий по фронтенду
• Список событий, принимающих доклады
• Code Hipsters
• RND.js
Новинки Chrome 74
Node.js 12 и ES-модули
• Introducing Node.js 12
• Announcing a new --experimental-modules
Svelte 3
• Svelte 3: Переосмысление реактивности
Борьба с оптимизациями V8
• Нужно ли чистить строки в JS
Пространственная навигация
PWA в Google Play
• How to Get a PWA into the Google Play Store
• PWA Police: PWA Bugs
Ведущие: Вадим Макеев, Мария Просвирнина, Сергей Попов, Андрей Смирнов
Темы
00:00:00 Интро
00:02:21 События года
00:36:25 Зачем быть в ПК
00:49:01 Интересные доклады
01:03:10 Устройство фестиваля
01:08:30 Поддержка сообщества
01:21:34 Правила поведения
События года
• Стачка в Ульяновске 26–27 апреля
• Google I/O в Маунтин-Вью 7–9 мая
• YGLF в Вильнюсе 16–17 мая
• HolyJS в Питере 24–25 мая
• Frontend Conf в Москве 27–28 мая
• CSSconf в Берлине 31 мая
• JSConf в Берлине 1–2 июня
• UWDC в Челябинске 1 июня
• CSS Day в Амстердаме 13–14 июня
• JSConf.Asia в Сингапуре 14–16 июня
• ChernivtsiJS в Черновцах 22–23 июня
• Rolling Scopes Conference в Минске 9–11 августа
• TechTrain в Питере 24–25 августа
• CSS-Minsk-JS в Минске 20–21 сентября
• BeerJS Summit в Минске 20 июля
• CSSConf в Будапеште 25 сентября
• JSConf в Будапеште 26–27 сентября
• KharkivJS в Харькове 5–6 октября
Ведущие: Вадим Макеев, Максим Соснов, Настя Катаева
Темы
00:00:00 Интро
00:02:13 События
00:19:21 Учебник по JS и книги
00:32:52 Vue в N1
00:38:51 Статьи по JavaScript
00:41:59 Оптимизации V8
00:47:33 Флексы и подгриды
00:58:00 Переключатель темы
События
• DUMP в Екатеринбурге 19 апреля
• Видео с первого митапа ReactRussia
• GetIT Meetup в Москве 23 апреля
• Burning Lead Meetup #1 в Питере 25 апреля
• TradingView A11y Meetup в Ростове-на-Дону 26 апреля
• Я.Субботник в Москве 27 апреля
• Panda Frontend Meetup в Москве 17 мая
• TechTrain в Питере 24–25 августа
• KharkivJS в Харькове 5–6 октября
Учебник по JS и книги
• The Modern JavaScript Tutorial
• Старый учебник по JavaScript
• Перевод нового учебника по JavaScript
• Frontend Handbook 2019
Vue в N1
• Vue.js в действии
• Nuxt 2.6 released!
Статьи по JavaScript
• Анонимные функции в JavaScript
• Domain-Oriented Observability
Оптимизации V8
• V8: Optimizing the scanner
• V8: Lazy parsing
Флексы и подгриды
• Common CSS Flexbox Layout Patterns with Example Code
• CSS masonry with flexbox, :nth-child(), and order
• CSS Subgrid News and demos
Переключатель темы
• Create A Dark/Light Mode Switch with CSS Variables
• Inclusive Components: Toggle Buttons
Ведущие: Вадим Макеев, Павел Малышев
Темы
00:00:00 Интро
00:02:10 События
00:13:48 Edge на Chromium
00:25:32 Новый релиз jQuery
00:33:45 JS-импорты, SEO и SSR
00:53:25 Веб-компоненты
01:21:57 Svelte и SPA без рантайма
Павел Малышев
• Павел в Твиттере
• Svelte в Телеграме
События
• WSD в Москве 13 апреля
• Pitercss_meetup в Питере 17 апреля
• CyprusJS Meetup на Кипре 18 апреля
• Mobile JS в Москве 18 апреля
• Global City Hackathon в Нижнем Новгороде 19–21 апреля
• ITSubbotnik Spring в Москве 20 апреля
• PiterJS tour#1 в Москве 26 апреля
• NodeSchool SPb в Питере 27 апреля
• HolyJS в Питере 24–25 мая
• Frontend Conf в Москве 27–28 мая
Edge на Chromium
• Microsoft Edge Insider Channels
• What to expect in the new Microsoft Edge Insider Channels
• Edge team throwed out these stuff from Chromium
• Edge Goes Chromium: What Does it Mean for Front-End Developers?
• Is Chrome pulling so far ahead that other browsers can’t keep up?
• Beyond the polyfills: how Web Components affect us today?
Новый релиз jQuery
• Stack Overflow Developer Survey Results 2019
• jQuery 3.4.0 Released
JS-импорты, SEO и SSR
• Dimport
• Shimport
• JS SEO: Angular
• JS SEO: React
• JS SEO: Vue
• Готовим изоморфные веб-приложения правильно
Веб-компоненты
• Inline an SVG file in HTML
• Lit-html
• LitElement
• Stencil
Svelte и SPA без рантайма
Ведущие: Вадим Макеев, Сергей Рожков, Иван Сорокин
Темы
00:00:00 Интро
00:02:33 События
00:15:46 Safari 12.1 и IE11
00:32:16 Веб-воркеры и ленивые картинки
00:49:17 Sass, Эрик Мейер и CSSBattle
Сергей и Иван
• Сергей Рожков в Телеграме
• Иван Сорокин в Телеграме
События
• Tech Meetup в Витебске 6 апреля
• Specia Front-end Meetup в Питере 9 апреля
• Raiffeisen Front-end MeetUp в Москве 11 апреля
• MinskCSS Meetup в Минске 11 апреля
• WSD в Москве 13 апреля
• DUMP в Екатеринбурге 19 апреля
• KharkivCSS в Харькове 20 апреля
• Google I/O 7–9 мая
Safari 12.1 и IE11
• New WebKit Features in Safari 12.1
• Safari 12.1 Release Notes
• Can I Stop?
Веб-воркеры и ленивые картинки
• Ускоряем WebGL и Three.js с OffscreenCanvas и веб-воркерами
• Native image lazy-loading for the web!
• Comlink
Sass, Эрик Мейер и CSSBattle
• Ruby Sass Has Reached End-Of-Life
• Color Me FACE1E55
• Издана книга «CSS. Полное руководство»
• CSS: The Definitive Guide, 4th Edition
• Использование Service Worker на MDN
• CSSBattle
Ведущие: Vadim Makeev, Diego Gonzalez
Темы
00:00:00 Интро
00:02:01 Why Samsung needs a browser?
00:08:00 Samsung DevRel’s focus
00:11:06 Samsung platforms
00:15:24 WebVR to WebXR transition
00:19:28 XR use cases for the Web
00:28:58 Where’s Apple
Diego Gonzalez
• Twitter
• Website
• Immersed in the Web at CodeFest
• Samsung Internet for Developers
Ведущие: Вадим Макеев, Илья Климов
Темы
00:00:00 Интро
00:01:44 События
00:10:18 WebStorm, редакторы, GitLab
00:32:59 LitElement, Svelte, рантайм
00:49:30 Образование онлайн и офлайн
Илья Климов
• JavaScript.Ninja
• Страница на Патреоне
• Канал на Ютубе
События
• RND.JS в Ростове-на-Дону 6 апреля
• Specia Front-end Meetup в Питере 9 апреля
• MoscowJS Geo Meetup в Москве 10 апреля
• Joomla ☆ Meetup в Москве 12 апреля
• Storm the Front в Гомеле 13 апреля
• Frontend Panda Meetup в Москве 19 апреля
WebStorm, редакторы, GitLab
• WebStorm 2019.1
• Oni
• Revery
• GitLab
• GitLab Unfiltered
LitElement, Svelte, рантайм
• Знакомство с LitElement и веб-компонентами
• Polymer Project
• Почему Svelte лучше для новых разработчиков
Образование онлайн и офлайн
• An illustrated (and musical) guide to map, reduce, and filter
• Standardizing WASI to run WebAssembly outside the web
• Компьютерная школа Hillel
• JavaScript.Ninja
• Курс «Основы JavaScript»
Ведущие: Вадим Макеев, Юля Музафарова
Темы
00:00:00 Интро
00:02:12 События
00:09:49 Chrome 74 без мельтешения
00:15:21 Firefox 66 и редактор фигур
00:25:09 Safari и подчёркивание
00:29:31 Мечты про aspect ratio
00:34:23 Гриды в продакшене
00:37:28 Яндекс.Касса и Whitepaper
00:48:40 Рисование на CSS
Юля Музафарова
События
• БКС Frontend MeetUp в Москве 27 марта
• AlfaBank JavaScript MeetUP в Москве 27 марта
• Pitercss_meetup в Питере 27 марта
• OdessaFrontend в Одессе 27 марта
• CodeFest в Новосибирске 30–31 марта
• Tech Meetup в Витебске 6 апреля
• DUMP в Екатеринбурге 19 апреля
• Скидка 5% на DUMP с кодом web-standards
• KharkivCSS в Харькове 20 апреля
Chrome 74 без мельтешения
Firefox 66 и редактор фигур
• Firefox 66 for developers
• 8 videos Firefox shape path editor
• VisBug
Safari и подчёркивание
• Safari: text underline offset and thickness
Мечты про aspect ratio
• Designing an aspect ratio unit for CSS
• CSS Nesting working draft
• PostCSS color-mod() function
Гриды в продакшене
• How to convince your team to adopt CSS Grid
Яндекс.Касса и Whitepaper
Рисование на CSS
• Анимация на CSS
• Pure CSS Figures
• Spirit
• Сергей Ратников
• Крис Гэннон
Ведущие: Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:40 События
00:12:01 Chrome 73
00:22:15 React Native 0.59
00:28:33 CSS Nesting
00:33:40 KV Storage
00:43:42 ARIA Live Regions
00:47:50 Веб-компоненты
01:00:35 Условные ES-модули
События
• ivi JS Meetup в Москве 21 марта
• Moscowcss в Москве 25 марта
• OdessaFrontend в Одессе 27 марта
• AngularMoscow в Москве 28 марта
• Webdev митап в Новосибирске 28 марта
• CodeFest в Новосибирске 30–31 марта
• MinskCSS Meetup в Минске 11 апреля
• Kolesa Conf в Алматы 12 апреля
• WSD в Москве 12–13 апреля
• DUMP в Екатеринбурге 19–20 апреля
• KharkivCSS в Харькове 20 апреля
• KharkivCSS на [email protected] до 22 марта
• HolyJS в Питере 24–25 мая
Chrome 73
React Native 0.59
• Releasing React Native 0.59
• Валентин Шергин, React Native Core
CSS Nesting
KV Storage
• KV Storage: the Web’s first built-in module
ARIA Live Regions
• Всё, что нужно знать про ARIA Live Regions
• Screen reader basics: VoiceOver
• Screen reader basics: NVDA
Веб-компоненты
• Веб-компоненты в реальном мире
• Lit-element
• Lit-html
Условные ES-модули
• Support for differential script loading
• First-class differential loading support
Ведущие: Вадим Макеев, Игорь Алексеенко, Игорь Антонов, Олег Акинин
Темы
00:00:00 Интро
00:04:25 Автор JS-курсов
00:17:33 События
00:22:10 Встроенный скроллер в Chrome
00:34:11 Развитие SVG и & в CSS
00:50:19 Preact и технологии интенсивов
01:03:13 JS для старых браузеров
01:22:35 Модули и импорт без Webpack
Автор JS-курсов
• Автор интенсивных курсов по JS
• Профессиональный JS, уровень 1
• Профессиональный JS, уровень 2
• Профессиональный JS, уровень 3
• Мультифора
События
• JavaScript fwdays в Киеве 16 марта
• BeerJS Summit в Минске 29 июля
• NodeSchool SPb в Питере 30 марта
• CodeFest в Новосибирске 30–31 марта
• В окружении зомби: станция метро
Встроенный скроллер в Chrome
• Release Notes Safari TP 77
• Virtual-scroller
• HTML Template Instantiation
Развитие SVG и & в CSS
• SVG Community Group
• CSS Nesting Module, ED
• O’Reilly: SVG Animations
• O’Reilly: SVG Essentials
Preact и технологии интенсивов
JS для старых браузеров
• Supporting old browsers without hurting everyone
• JavaScript iterator patterns
Модули и импорт без Webpack
• It will never be part of the ES thanks to TC39 politics
• JS thought leader explains how standards are not important
• Deploying ES2015+ Code in Production Today
Ведущие: Вадим Макеев, Мария Просвирнина, Олег Мохов
Темы
00:00:00 Интро
00:01:53 События
00:11:57 Математика в CSS
00:26:09 Быстродействие и оверхэд
00:35:12 Новый видеокодек AV1
00:46:24 JavaScript и SEO
00:51:06 Роботы нас не заменят
События
• SPB Frontend в Питере 5 марта
• React Russia Meetup #1 в Питере 16 марта
• Розыгрыш билетов среди патронов — [email protected]
• React Amsterdam 12 апреля
• React Finland 24–26 апреля
• ChernivtsiJS 2019 в Черновцах 22 июня
• Rolling Scopes в Минске 9–11 августа
Математика в CSS
• CSSWG adding many math functions
• CSS Values L4: calc, min, max, clamp
• Rule 110 in CSS
Быстродействие и оверхэд
Новый видеокодек AV1
• Better web video with AV1 codec
JavaScript и SEO
Роботы нас не заменят
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:22 События
00:11:23 Npm для энтерпрайза
00:17:20 Приоритеты загрузки JS
00:23:53 Цена сторонних скриптов
00:43:13 JS прямо в CSS
00:53:19 Доступный TodoMVC
00:58:48 Кастомные чекбоксы
01:06:43 Выравнивание по тексту
События
• Pitercss_meetup в Питере 27 февраля
• JavaScript Party в Новосибирске 28 февраля
• Фронтенд-2019 в Москве 6 марта
• Krasnodar Frontend Meetup #5 в Краснодаре 16 марта
• Secon в Пензе 19–20 апреля
• React Amsterdam в Амстердаме 10–12 апреля
• 15% скидка на React Amsterdam — WSD_RA_15
• Патреон «Веб-стандартов»
• Розыгрыш билета среди патронов — [email protected]
Npm для энтерпрайза
• Npm Enterprise
• Managing JavaScript in the Enterprise
Приоритеты загрузки JS
• JavaScript Loading Priorities in Chrome
Цена сторонних скриптов
• Third Party Web
• 65% of all script execution on the web
Доступный TodoMVC
• Инклюзивные компоненты: список дел
Кастомные чекбоксы
• Кастомные чекбоксы правильно
• Демо с кодом
• The proposed box-suppress property
Выравнивание по тексту
• Intro to Font Metrics
• Leading control at start/end of block
Ведущие: Ольга Алексашенко, Вадим Макеев, Артём Поликарпов
Темы
00:00:00 Интро
00:01:28 События
00:04:35 Chrome 73 и CSS 2019
00:12:24 SVG, таблицы, гриды и кнопки
00:41:40 Будущее Фоторамы
События
• PiterJS №34 в Питере 20 февраля
• Tver.io Poetry Meetup в Твери 21 февраля
• MinskJS Meetup 5 в Минске 21 февраля
• MoscowJS 44 в Москве 21 февраля
• На митап! HTML Academy онлайн 23 февраля
• NodeSchool SPb №30 в Питере 23 февраля
• Zlit: Страх и ненависть в IT в Киеве 23 февраля
• Pitercss_meetup в Питере 27 февраля
• SPB Frontend в Питере 5 марта
Chrome 73 и CSS 2019
• Chrome 73 Beta
• Constructable Stylesheets: seamless reusable styles
• The State of CSS 2019
SVG, таблицы, гриды и кнопки
• Making Future Interfaces: Inline SVG
• Table Design Patterns On The Web
• The Dark Side of the Grid
• Links that don’t go anywhere should be buttons
Будущее Фоторамы
• Rewrite the MDN page header
• HyperHTML
• Фоторама
• Websites using Fotorama
• Фоторама на Гитхабе
• Mavo: Create web apps entirely by writing HTML!
Ведущие: Вадим Макеев, Юля Бухвалова
Темы
00:00:00 Интро
00:01:07 События
00:09:44 Перевод документации React
00:14:52 Статьи про вёрстку
00:33:27 Логический CSS
00:42:48 SVG-фильтры
00:54:16 Цветные шрифты
01:01:16 Полезные инструменты
События
• Я ❤ Frontend в Москве 9 февраля
• OdessaFrontend #10 в Одессе 20 февраля
• PiterJS №34 в Питере 20 февраля
• MoscowJS 44 в Москве 21 февраля
• Zlit: Страх и ненависть в IT в Киеве, 23 февраля
• EPAM JavaScript Meetup в Питере 26 февраля
• Стачка в Ульяновске 26–27 апреля
Перевод документации React
• Перевод документации по React
Статьи про вёрстку
• My CSS Grid Wishlist
• Адаптивная галерея
• A Year of Utility Classes
• Organise CSS properties like a Christmas Tree
Логический CSS
• Новые логические свойства в CSS!
SVG-фильтры
• Outline Text with feMorphology
• Poster Image Effect with feComponentTransfer
• Duotone Images with feComponentTransfer
• Слайды доклада «SVG-фильтры»
• Демка Юли «Мозги»
• Демка Габи «Рябь на воде»
Цветные шрифты
• Colorful typography on the web
• The first cross-browser color font format
• Chris Lilley: Everything Changes
Полезные инструменты
• Курсы по SVG
• SVG Filters
• SVG Gradient Map Filter
• URL-encoder for SVG
• Common Words
• HTML Tree
• Pixel Glass
• Handy Colors
• Flexbox Cheatsheet
• Таблица символов юникода
• Wave Maker
• Shadow Painter
Ведущие: Вадим Макеев, Мария Просвирнина, Сергей Рубанов
Темы
00:00:00 Интро
00:02:13 Три года в эфире
00:04:30 События
00:05:38 JS-разработчики для ТВ
00:12:08 Chrome, Safari, PWA
00:29:34 Safari и JS Core
00:46:43 CSS против JS
01:07:17 ES2019
Три года в эфире
• Выпуск №1, 1 февраля 2016
• Страница с подкастом на новом сайте
• Задача собрать карту из календаря
События
• Simferopol Frontend в Симферополе 26 января
• WebJam
• NodeSchool SPb в Питере 23 февраля
• WSD в Москве 13 апреля
JS-разработчики для ТВ
• Сворачивающийся телевизор
• JS-разработчик №1
• JS-разработчик №2
Chrome, Safari, PWA
• Chrome защитит от перехода не туда
• Safari 12.1 Release Notes
• PWAs on iOS 12.2 beta
• PWA Progress in iOS 12.2 Beta 1
• Google Play Store now open for PWA
Safari и JS Core
• WebExtensions v3 considered harmful
• JS engine fundamentals: optimizing prototypes
• Browser Market Share Worldwide
• V8 Internals For JavaScript Developers
CSS против JS
• HTML, CSS и исчезающие точки входа в индустрию
• CSS and JS Are at War, Here’s How to Stop It
• The Great Divide
ES2019
• Что нового в JavaScript 2019? Дэвид Нил
• Что нового в JavaScript 2019? Сергей Рубанов
• Future JavaScript: what is still missing?
• When past decisions come back to bite us
Ведущие: Вадим Макеев, Алексей Симоненко, Роберт Харитонов, Денис Радин
Темы
00:00:00 Интро
00:03:06 Сайт «Веб-стандартов»
00:05:33 События и сообщества
00:25:07 Новинки Safari TP
00:33:08 Свежие статьи
00:48:14 Снипеты и редакторы кода
00:58:11 Кому нужен VR
01:07:21 Фонд GitNation
Сайт «Веб-стандартов»
• GitHub: web-standards-ru/new
• Патреон «Веб-стандартов»
События и сообщества
• ReactRussia в Петербурге 16 марта
• MoscowJS WebGL Meetup в Москве 31 января
• MinskJS Meetup 5 в Минске 21 февраля
• CSS-Minsk-JS
• Pitercss_conf
• React Amsterdam в Амстердаме 11–12 апреля
• Amsterdam JSNation в Амстердаме 6–7 июня
Новинки Safari TP
• Safari Technology Preview 74
• CSS Color L4: rgb functions
• Visual Viewport API
Свежие статьи
• «Исправление» списков
• Text-transform и копирование
Снипеты и редакторы кода
Кому нужен VR
• VR project with Three.js & WebVR
• A-Frame
Фонд GitNation
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:20 События
00:02:18 JavaScript в вузах
00:11:37 JS десять лет назад
00:16:57 Браузеры и текст в VR/AR
00:36:50 HTML-модули в JS
События
• Pitercss_meetup в Питере 28 января
• CodeFest в Новосибирске 30–31 марта
• DUMP в Екатеринбурге 19 апреля
• Frontend Conf в Москве 27–28 мая
JavaScript в вузах
• 100 видео-лекций по программированию
• Курс лекций по JavaScript и Node.js в КПИ
• MIT Software Studio
• Harvard CS50 Seminars
JS десять лет назад
• WSD в Минске в 2009 году
• I almost couldn’t do this challenge
Браузеры и текст в VR/AR
• Google Glass
• Mozilla to Bring Firefox Reality to HTC VIVE Devices
• Breaking Boxes – Typography and Augmented Reality
• Типографика в дополненной реальности
• Основы адаптивной типографики
• Shiny: Simulating reflections with DeviceMotion
HTML-модули в JS
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:20 Подкаст
00:07:23 События
00:16:23 Перемены на Гитхабе
00:41:05 Браузерная поддержка
00:52:33 CSS-vs-JS
Подкаст
• Веб-стандарты в Spotify
• Веб-стандарты в Яндекс.Музыке
События
• Piter GraphQL Meetup в Питере 24 января
• Мастер-класс по GraphQL в Питере 26 января
• Промокод со скидкой: GRAPHQL1500
• с темой GraphQL на [email protected] до 17 января
• KharkivCSS 4 в Харькове 20 апреля
Перемены на Гитхабе
• Unlimited free private repos and unified Enterprise
Браузерная поддержка
• GitHub ships native ES and WC, by the way
• We’re looking to do this at LinkedIn too
CSS-vs-JS
• CSS is the most complicated API in wide use
• We’re seeing the same thing today with CSS
• CSS: новый вид JavaScript
Ведущие: Вадим Макеев, Андрей Мелихов
Темы
00:00:00 Интро
00:01:58 Успехи Патреона
00:05:55 События
00:14:43 A11y и ответственность за UX
00:26:41 SVG-фильтры
00:31:35 Скринкасты и поля классов из ES
00:51:00 Монорепозитории
Успехи Патреона
События
• NodeSchool SPb №29 в Питере 27 января
• Я ❤ Frontend в Москве 9 февраля
• JavaScript fwdays в Киеве 16 марта
• React Russia Meetup #1 в Питере 16 марта
• React Amsterdam в Амстердаме 12 апреля
A11y и ответственность за UX
• Инклюзивные компоненты: переключатели
SVG-фильтры
• SVG Gradient Map Filter
• SVG Filters
• URL-encoder for SVG
Скринкасты и поля классов из ES
• JavaScript реализация throttle на пальцах
• Y-комбинатор на JavaScript
• Glitch
• Канал Рубанова в Телеграме
• The new feature on the horizon in ES: Class Fields
Монорепозитории
• Monorepos: Please don’t!
• Монорепозитории: пожалуйста не надо
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
01:25:58 Песня
Ссылки
• Веб-стандарты на Патреоне
• Things I Don’t Know as of 2018
• Microsoft + GitHub = Empowering Developers
• Edge: Making the web better through open source
• Профессиональный JavaScript, уровень 3
Ведущие: Вадим Макеев, Гордей Левченко, Игорь Романов, Таир Сабыргалиев
Темы
00:00:00 Интро
00:01:37 События сообщество в Астане
00:14:06 YouTube против Edge
00:30:16 Android и PWA
00:43:11 Картинки, офлайн и сервис-воркеры
00:53:03 Про CSS прямо из спеки
00:59:55 Фулстек как единорог
События сообщество в Астане
• Я ❤ Frontend в Москве 9 февраля
• AstanaJS в Астане 22 декабря
YouTube против Edge
• Did Google cripple Edge’s youtube performance?
Android и PWA
• A cold war between Android and Chrome because of PWAs?
• WebKit: Implement the Web Share API
Картинки, офлайн и сервис-воркеры
• Styling Broken Images
• Handling broken images with the service worker
Про CSS прямо из спеки
• Researching a Property in the CSS Specs
• MDN: rel="preload"
Фулстек как единорог
Ведущие: Вадим Макеев, Игорь Зиновьев, Роман Гафиатуллин
Темы
00:00:00 Интро
00:01:53 События и сообщество в Казани
00:18:27 Chrome 72, i18n, монополия
00:46:53 SVG и слишком сложный CSS
01:16:02 Сборка и ES-модули
События и сообщество в Казани
• CFP list Александра Коротаева
• Pitercss_class в Питере 22 декабря
• AstanaJS в Астане 22 декабря
• KazanJS в Казани 18 декабря
Chrome 72, i18n, монополия
• Chrome 72 Beta
• Эрик Эллиот про ФП
• The Intl.ListFormat API
• TC39: Standard Library Proposal
• Moment — Luxon
• YouTube was changed to slow Edge
SVG и слишком сложный CSS
• Доступные SVG-иконки с инлайновыми спрайтами
• О преимуществах встраивания CSS в JS
Сборка и ES-модули
• Современная сборка на ES-модулях
• JavaScript для детей
• Deploying ES2015+ Code in Production Today
Ведущие: Вадим Макеев, Иван Новиков, Илья Лесик
Темы
00:00:00 Интро
00:02:29 События и сообщество в Твери
00:14:08 Firefox, скролбары и движки
00:48:53 Quicklink и Resource Hints
00:56:42 Аутлайны, формы и таблицы
События и сообщество в Твери
• Девять видео с WSD в Петербурге
• Восемь видео с WSD в Киеве
• Tver.io Anniversary Meetup в Твери 13 декабря
• Тверское ИТ-сообщество
• Winter Frontend meetup в Москве 13 декабря
• AstanaJS #2 в Астане 22 декабря
• Pitercss_meetup №27 в Питере 25 декабря
Firefox, скролбары и движки
• Firefox 64
• KaiOS
• Разнообразие браузеров начинается с нас
Quicklink и Resource Hints
• Quicklink
• Resource Hints: Prefetch
Аутлайны, формы и таблицы
• Просто используйте стили для :focus, чёрт возьми
• Inclusive Considerations When Restyling Form Controls
• CSS Grid Level 2: Here Comes Subgrid
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:24 События
00:03:26 Edge теперь Chrome
00:35:49 Flutter для веба
00:42:07 Доступность
События
• 10 видео с WSD в Минске
• Market Frontend Meetup в Москве 11 декабря
• OdessaFrontend #9 в Одессе 12 декабря
• SPB Frontend в Питере 12 декабря
• MinskCSS Meetup 5 в Минске 13 декабря
• Tver.io Anniversary Meetup в Твери 13 декабря
• GDG DevFest Belarus в Минске 16 декабря
• KazanJS 5 в Казани 18 декабря
Edge теперь Chrome
• Release Notes for Safari TP 71
• New in Chrome 71
• Microsoft Edge and Chromium Open Source
• Today’s Edge announcements tl;dr
• EdgeHTML: a bad demise nobody much noticed
• The State of Web Browsers
• Windows 7–10 + Mac vs Windows 10 only
• Goodbye, EdgeHTML
• Yandex Hill
• Puppeteer for Firefox
Flutter для веба
• Hummingbird: Building Flutter for the Web
Доступность
• Доступные SVG-иконки с инлайновыми спрайтами
• Руководство по разработке доступных интерфейсов
Ведущие: Вадим Макеев, Егор Гуринович, Егор Мясников, Павел Юхнович
Темы
00:00:00 Интро
00:01:12 События
00:08:39 Rolling Scopes
00:29:48 Доступность
00:46:34 Фигуры и шрифты
00:50:05 Прогрессивная графика
01:00:58 Как же без React
01:12:57 Опасный опенсорс
События
• WSD в Минске 1 декабря
• Frontend-Con в Варшаве 3-4 декабря
• Sofia Vue.js Meetup #1 в Софии 4 декабря
• Storm the Front Meetup #3 в Гомеле 8 декабря
• Rolling Scopes 52 в Минске 12 декабря
• MinskCSS #5 в Минске 13 декабря
• Юбилейный митап Tver.io в Твери 13 декабря
• GDG DevFest в Минске 16 декабря
• CSSconf EU в Берлине 31 мая
• JSConf EU в Берлине 1–2 июня
• React.Amsterdam в Амстердаме 12 апреля
Rolling Scopes
Доступность
• Правила доступности, которые останутся в памяти
• A11y in Russia?
• Доступность в Википедии
Фигуры и шрифты
• Making Future Interfaces: Unusual Shapes
• Should I Use JavaScript to Load My Web Fonts?
Прогрессивная графика
• Генерируем красивые SVG-плейсхолдеры на Node.js
• Why and how to use WebP images today
• Skillbox, оптимизация графики, Squoosh и элемент picture
Как же без React
• React 16.x Roadmap
• Перенос на новую строку в JSX
• 5 Ways to Style React Components in 2019
Опасный опенсорс
Ведущие: Вадим Макеев, Артём Поликарпов, Мария Просвирнина
Темы
00:00:00 Интро
00:01:37 События
00:08:05 Хорошо без AMP и PWA
00:19:40 Основы веба
00:22:24 Как Google Search видит
00:32:12 Сторонние скрипты и Чатра
01:05:32 Хромой фулстек и вакансия
01:33:42 HTM как замена JSX
01:40:33 Mortal Kombat вживую
Интро
• Артём Поликарпов в Бюро Горбунова
• Технолог — тоже дизайнер
• Фоторама
События
• DevFest SPB в Питере 27 ноября
• Moscow GraphQL Meetup в Москве 27 ноября
• Frontend Mix в Питере 28 ноября
• WSD в Минске 1 декабря
• Chernivtsi.min.js #4 в Черновцах 1 декабря
• Moscowcss 10 в Москве 4 декабря
• Market Frontend Meetup в Москве 11 декабря
• SPB Frontend в Питере 13 декабря
• YGLF Vilnius в Вильнюсе 16–17 мая
Хорошо без AMP и PWA
• You need neither PWA nor AMP to make your website load fast
• Моё разочарование в софте
Основы веба
• From URL to Interactive
• Server to Client
• Tags to DOM
• Braces to pixels
Как Google Search видит
• Deliver search-friendly web applications
• Deliver search-friendly JS-powered websites
Сторонние скрипты и Чатра
• Chatra
Хромой фулстек и вакансия
• 10 things to learn for becoming a solid full-stack JS developer
• How Full Stack Development is destroying the web
• Разработчик в Чатру
HTM как замена JSX
• HTM (Hyperscript Tagged Markup)
Mortal Kombat вживую
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:28 События
00:06:51 Chrome Dev Summit
00:36:43 API к персональным данным
00:52:10 HTTP уже 3
01:13:26 Веб-компоненты
События
• Pitercss_meetup №26 в Питере 20 ноября
• SPB Frontend Meetup в Питере 21 ноября
• MoscowJS 43 в Москве 22 ноября
• DevFest Siberia в Новосибирске 23–25 ноября
• Panda-Meetup №9 в Самаре 24 ноября
• DevFest Voronezh в Воронеже 24 ноября
• NodeSchool SPb №28 в Питере 24 ноября
• JSNN #11 в Нижнем Новгороде 24 ноября
• HolyJS в Москве 24–25 ноября
• DevFest SPB в Питере 27 ноября
• WSD в Минске 1 декабря
• JS Tgn Weekend meetup #12 в Таганроге 1 декабря
• DartUP в Питере 1 декабря
Chrome Dev Summit
• Видео с Chrome Dev Summit
• Портал web.dev
• Imagemin Gulp
• WebP CLI
• PageSpeed Insights
• Squoosh
• VisBug
API к персональным данным
• Intent to Implement: Contacts API
• Explainer: Contact Picker API
HTTP/3 на UDP
Веб-компоненты
Ведущие: Алексей Золотых, Вадим Макеев, Стас Курилов, Алексей Симоненко
Темы
00:00:00 Интро
00:00:58 События
00:12:48 Веб-приложения на десктопе
00:38:35 Безопасность и фронтопсы
01:14:28 Test262, Babel и Webpack
01:35:22 Вопросы к HolyJS
События
• Chrome Dev Summit в Сан-Франциско 12–13 ноября
• Google Developer Experts
• HolyJS в Москве 24 ноября
• WSD в Минске 1 декабря
• DartUP в Питере 1 декабря
• Storm the Front meetup #3 в Гомеле 8 декабря
• CFP на CSSConf в Берлине 31 мая
• CFP на JSConf в Берлине 1–2 июня
Веб-приложения на десктопе
• Google Chrome Labs: Carlo
• WebUSB API
• Language Server Protocol
• BopPad
• BopPad Editor
Безопасность и фронтопсы
• Laboratory: CSP Toolkit
• Девшахта 53: DevOops 2018
Test262, Babel и Webpack
• Announcing Test262 Report
• Babel 7 Released
Вопросы к HolyJS
• HolyJS в Москве 24 ноября
• Скидка 1000 ₽ при покупке билета с промокодом wst
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:39 События
00:06:23 Тёмный режим в Safari
00:15:28 WebAssembly в Chrome
00:21:10 Что нового в CSS
00:29:08 Сортировка CSS-свойств
00:38:45 Вариативные шрифты с фолбэком
00:46:42 Почему у дизайнеров не получается
00:55:06 Хуки, или React по-новому
События
• Kottans: курс по фронтенду в Киеве
• DevFest Siberia 23-25 ноября, Новосибирск
• Fronthub в Ульяновске 27 ноября
• WSD в Минске 1 декабря
Тёмный режим в Safari
• Safari TP 68
• Using dark mode in CSS with MacOS Mojave
• Prefers-color-scheme in a picture
WebAssembly в Chrome
• WebAssembly Threads ready to try in Chrome 70
• Origin Trials in Chrome
Что нового в CSS
• The CSS Working Group At TPAC: What’s New In CSS?
• Square that grows to hold all content
• Стандартизация стилей элементов форм
Сортировка CSS-свойств
• Keys to maintainable CSS: Order
Вариативные шрифты с фолбэком
• Implementing a variable font with fallback web fonts
Почему у дизайнеров не получается
• Почему у дизайнеров не получается изучать веб-технологии?
• Блог Вадима Макеева на Ютубе
Хуки, или React по-новому
• Making sense of React Hooks
• Collection of React hooks
• useHooks
Ведущие: Олег Исонен, Вадим Макеев, Артём Сапегин
Темы
00:00:00 Интро
00:02:42 События в Берлине
00:05:05 Веб-компоненты
00:18:52 PWA на десктопе
00:36:33 Styleguidist и JSS
00:42:40 CSS-in-JS
События в Берлине
• React Day
• React Girls Berlin
Веб-компоненты
• Firefox 63 Tricks and Treats!
• React vs Web Components
PWA на десктопе
• Chrome Desktop PWA: Windows
• Chrome Desktop PWA: Linux
Styleguidist и JSS
• Styleguidist
• Storybook
• JSS
CSS-in-JS
• Styled-components v4
• Create React App + astroturf
• Linaria
• Astroturf
• CSS Modules
Ведущие: Вадим Макеев, Николай Птущук
Темы
00:00:00 Интро
00:01:20 События
00:07:07 Chrome 70 и WebKit 2019
00:20:21 Пропорциональная резина
00:24:24 GitHub Actions
00:28:20 Adobe Fonts
00:32:11 Слабые стороны ES6
00:51:14 Фронтенд в Одессе
События
• VuePiterJS №2 в Питере 25 октября
• KyivJS #20 в Киеве 26 октября
• WSD в Киеве 27 октября
• Hacktoberfest Lviv во Львове 27 октября
• ITsubbotnik Tech Mix в Москве 27 октября
• Я.Субботник в Москве 27 октября
• ReactiveConf в Праге 29–31 октября
• LvivCSS во Львове 10 ноября
Браузеры
• New in Chrome 70
• WebKit Feature Focus for 2018-2019
• CSS Intrinsic & Extrinsic Sizing L4
Новости
• GitHub Actions
• Introducing GitHub Actions
• GitHub Actions: built by you, run by us
• Adobe Fonts
JavaScript
• JavaScript ES6: слабые стороны
• Вредная элитарная точка зрения. Обсудим?
• How To Serve Legacy Code Only To Legacy Browsers
• Polyfill.io
Одесса
Ведущие: Вадим Макеев, Катя Поршнева, Сергей Фролов
Темы
00:00:00 Интро
00:01:58 События
00:07:06 Safari и Edge
00:15:35 Бюджет на перфоманс
00:26:44 Новые теги в HTML
00:40:51 Киевское сообщество
01:06:03 Кто такие Котаны?
События
• Я ❤ Frontend в Москве 9 февраля
• Вадим Макеев на Ютубе
• SPB Frontend в Питере 16 октября
• OdessaFrontend в Одессе 18 октября
• NodeSchool SPb в Питере 20 октября
• KyivJS в Киеве 26 октября
• WSD в Киеве 27 октября
• Pitercss_class в Питере 27 октября
• Kyiv Vue.js Meetup в Киеве 1 ноября
• BeerJS PubTalk в Киеве 17 ноября
Safari и Edge
• Safari TP 67
• Edge: Custom Elements
• Edge: Shadow DOM
• Edge: HTML Modules
Бюджет на перфоманс
• Start Performance Budgeting
• Владимир Агафонкин
• Иван Акулов
Новые теги в HTML
• Почему мы не добавим в HTML элемент чудесный?
Киевское сообщество
• KyivJS
• React Kyiv
• BeerJS Kyiv
• Goodness Squad #4
• AngularKyiv
• Kyiv Vue.js Meetup
Кто такие Котаны?
Ведущие: Вадим Макеев, Влад Антипенко, Артём Захарченко
Темы
00:00:00 Интро
00:01:07 События
00:03:15 Браузеры и расширения
00:14:44 Планы Vue.js 3.0
00:21:23 Цветная прокрутка
00:26:35 Фронтенд в Харькове
События
• Pitercss_meetup в Питере 10 октября
• EmberFest в Амстердаме 11–12 октября
• WSD в Киеве 27 октября
Браузеры и расширения
• What’s new in EdgeHTML 18
• WebP in Edge 18: Supported
• Trustworthy Chrome Extensions, by default
Планы Vue.js 3.0
• Планы на следующую версию Vue.js
Цветная прокрутка
• Первый черновик для оформления прокрутки
Фронтенд в Харькове
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:23 События
00:05:06 Пара новинок Safari
00:06:49 Семантика и TypeScript
00:12:13 Разработчики в W3C
00:21:52 Redux не нужен
00:27:54 Новый ES всё сломал
00:37:02 Новые стрелки в JS
События
• JavaScript Party в Новосибирске 3 октября
• Fronteers в Амстердаме 4–5 октября
• Frontend Conf в Москве 4–5 октября
• KharkivJS в Харькове 6–7 октября
• Я.Субботник в Москве 27 октября
• ITsubbotnik Tech Mix в Москве 27 октября
• WSD в Киеве 27 октября
• UfaDevConf в Уфе 17 ноября
Пара новинок Safari
• Release Notes for Safari Technology Preview 66
Семантика и TypeScript
• Почему семантический HTML важен, и как TypeScript помогает это понять
Разработчики в W3C
• Representing Web Developers In The W3C
• Web Developer Representation in W3C
Redux не нужен
• Прощай, Redux. Почему он нам больше не нужен
• Make frontend «backend» again
Новый ES всё ломает
• Highcharts.js line labels disappear with Array#flat enabled
• ES Proposal: Global
• Global breaks Flickr
• ES Proposal: Temporal
Новые стрелки в JS
Ведущие: Vadim Makeev, Bram Stein, Patrick Lauke, Hui Jing Chen, Anna Migas
Темы
00:00:00 Интро
00:00:34 Bram Stein
00:17:07 Patrick Lauke
00:48:31 Hui Jing Chen
01:16:58 Anna Migas
Bram Stein
• Bram on Twitter
• Webfont Handbook
• Adobe Typekit
Patrick Lauke
• Patrick on Twitter
• Getting Touchy
• An introduction to ARIA
Hui Jing Chen
• Hui Jing on Twitter
• Hui Jing’s blog
Anna Migas
Ведущие: Вадим Макеев, Мария Просвирнина, Алекс Канунников
Темы
00:00:00 Интро
00:01:13 События
00:06:33 10 лет Chrome
00:24:55 Кому нужен URL
00:32:08 Что такое каскад
00:39:28 Курсор на кнопках
00:45:39 Микробенчмаркинг
00:49:29 DOM в воркерах
01:09:18 JS 2018
События
• SPB Frontend в Питере 18 сентября
• JavaScript Open Day в Питере 19 сентября
• OdessaFrontend #7 в Одессе 19 сентября
• NodeSchool SPb №26 в Питере 22 сентября
• DevFest Siberia в Новосибирске 23–25 ноября
• Grow Paris в Париже 12-16 ноября
10 лет Chrome
• 10 Years of Chrome DevTools
• Расширение Web Developer
• What’s New in DevTools
• 10 years of Speed in Chrome
• Chrome 70 beta
Кому нужен URL
Что такое каскад
• The Cascade and Other Essential Unessentials
• Никто не знает CSS: специфичность — не каскад
Курсор на кнопках
Микробенчмаркинг
• Adventures in Microbenchmarking
DOM в воркерах
• WorkerDOM
• AsyncDom
• AsyncDom на PiterJS
JS 2018
Ведущие: Вадим Макеев, Валерия Курмак
Темы
00:00:00 Интро
00:02:51 События
00:12:14 Новости браузеров
00:19:56 Ссылки в ссылках
00:25:43 Доступность интерфейсов
События
• Pitercss_meetup в Питере 11 сентября
• Tver.io 0x100 DevDay в Твери 13 сентября
• AstanaJS в Астане 13 сентября
• SPB Frontend в Питере 18 сентября
• Node.js SPb Meetup в Питере 27 сентября
• Chrome Dev Summit в Сан-Франциско 12–13 ноября
Новости браузеров
• New in Chrome 69
• Firefox 62
• Chrome’s NOSCRIPT Intervention
• Take A New Look At CSS Shapes
• Firefox Shape Path Editor
Ссылки в ссылках
• Nested Links Without Nesting Links
• HTML Шорты: Ссылки вокруг блоков
Доступность интерфейсов
• Как не создавать барьеры для незрячих
• О доступности интерфейсов из первых уст
• The A11Y Project
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:39 События
00:11:32 Chrome не такой дерзкий
00:24:03 Firefox против трекеров
00:42:12 Опенсорс и политика
01:04:47 OpenType и полезный каскад
01:19:41 Развитие React DOM
События
• BeerJS PubTalk в Киеве 8 сентября
• JSNN #10 в Нижнем Новгороде 8 сентября
• RND.JS #7 в Ростове-на-Дону 8 сентября
• DINS JavaScript meetup #1 в Питере 12 сентября
• Ufa Tensor Forum в Уфе 13 сентября
• KyivJS #19 в Киеве 14 сентября
• Krasnodar Dev Days #3 в Краснодаре 15 сентября
• FrontTalks в Екатеринбурге 14–15 сентября
• CSS-Minsk-JS в Минске 21–22 сентября
• Fronteers в Амстердаме 4–5 октября
• FrontendConf в Москве 4–5 октября
• KharkivJS в Харькове 6–7 октября
• Фестиваль 404 в Самаре 6–7 октября
Chrome не такой дерзкий
• Charting Browser Interoperability
• Flexbox is now used by ~82% of web pages
• BopPad Editor
• Web Bluetooth Implementation Status
Firefox против трекеров
• Cross-site tracking: Let’s unpack that
• Changing Our Approach to Anti-tracking
Опенсорс и политика
• Change MIT License on Lerna banning ICE collaborators
• Add text to MIT License banning ICE collaborators
• Restore unmodified MIT license
• MIT 3 Laws License
OpenType и полезный каскад
• The Complete CSS Demo for OpenType Features
• A Tale of Two Buttons
Развитие React DOM
• Reach UI
• React Fire: Modernizing React DOM
• Выпуск №122 с Алексеем Швайкой
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:40 События
00:04:49 Сертификаты и TLS 1.3
00:13:13 Флексы и кастомные свойства
00:34:30 Совместимость и -webkit-мусор
00:48:34 SVG-фильтры и WebGL
01:06:07 Новинки Node.js
События
• Izh Tech Talks #2 по фронтенду в Ижевске 30 августа
• CodeEvening MeetUP в Нефтекамске 31 августа
• Refresh Conference в Таллине 7 сентября
• DINS JavaScript meetup #1 в Питере 12 сентября
• FrontTalks в Екатеринбурге 14–15 сентября
• CSS-Minsk-JS в Минске 21–22 сентября
Сертификаты и TLS 1.3
• Symantec, GeoTrust, RapidSSL, Thawte, Verisign will be distrusted in October 2018
Флексы и кастомные свойства
• Firefox Nightly: column-gap and row-gap in Flexbox
• Интерактивные курсы (карточки на гридах)
• Custom CSS Properties do not worki inside @page
Совместимость и -webkit-мусор
• Webkit-prefixed pseudo-elements are always treated valid in WebKit and Blink
• CSS Selectors Level 4: Parsing Quirks
• Стандарт для нестандартного
SVG-фильтры и WebGL
• SVG Filters
• Глава 3: Размеры в SVG
• Understanding SVG Coordinate Systems and Transformations
• Введение в программирование шейдеров для верстальщиков
• HTML GL. Возьмите столько FPS, сколько вам нужно
• Стримы Юры Артюха
Новинки Node.js
• Experimental multi-threading support behind a flag in Node.js 10
• Node.js: HTTP2: graduate from experimental
Ведущие: Никита Дубко, Вадим Макеев, Мария Просвирнина, Саша Шинкевич
Темы
00:00:00 Интро
00:01:56 События
00:11:24 Невидимый DOM и файлы
00:25:10 Новые атрибуты для картинок
00:37:19 Веб-компоненты в Firefox
00:48:48 Новости из леса
00:54:49 Хорошая конференция
События
• WSD в Питере 18 августа
• NodeSchool Novosibirsk №5 в Новосибирске 25 августа
• NodeSchool SPb №25 в Питере 25 августа
• NodeSchool в Тюмени 1 сентября
• TechTrain в Питере 1–2 сентября
• FrontTalks в Екатеринбурге 14–15 сентября
• CSS-Minsk-JS в Минске 21–22 сентября
Невидимый DOM и файлы
• Chrome: Intent to Implement Searchable Invisible DOM
• Searchable Invisible DOM Explainer
• Chrome: Intent to Implement Writable Files
• Writable Files Explainer
Новые атрибуты для картинок
• Chrome Status: Intrinsic size attribute
• Intrinsicsize Attribute on Media Elements Explainer
• A native lazy load for the Web platform
Веб-компоненты в Firefox
• Intent to Ship: Shadow DOM and Custom Elements
Новости из леса
• Release Notes for Safari Technology Preview 63
• Grunt CLI 1.3.0 released
Хорошая конференция
• I Can Say Words Out Loud At Your Event
• My questions for event organizers
Ведущие: Вадим Макеев, Андрей Яманов, Алексей Охрименко
Темы
00:00:00 Интро
00:02:17 События
00:13:16 Новинки Chrome 69
00:23:23 Семантика для чтения
00:29:54 CSS без каскада
00:42:58 API для доступности
01:01:06 Выгорание
События
• Pitercss_meetup №23 в Питере 13 августа
• PiterJS №28 в Питере 16 августа
• WSD в Питере 18 августа
• FreeCodeCamp №22 в Москве 19 августа
• MoscowJS в Москве 23 августа
• FrontendConf в Москве 4–5 октября
• LvivCSS во Львове 10–11 ноября
• Скидка 10% по wst@LvivCSS2018
Новинки Chrome 69
• Chrome 69 Beta: CSS tricks, and more
Семантика для чтения
• Building websites for Safari Reader Mode and other reading apps
CSS без каскада и Гудини
• Styling language that looks like CSS but has no cascade
• Houdini API is now candidate recommendation
API для доступности
• Как не создавать барьеры для незрячих
• Вёрстка Canvas, Алексей Охрименко
• Accessibility Object Model
Выгорание
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:25 События
00:03:22 Подкастинг
00:08:11 Новинки браузеров
00:15:39 Уязвимость в React (Preact, Vue)
00:18:31 Неправильный пайплайн
00:25:04 Подгриды готовы
00:27:20 Сложная сетка вручную
00:35:48 Веб-компоненты
События
• Я.Субботник в Питере 11 августа
• БЭМап в Питере 12 августа
• Pitercss_meetup №23 в Питере 13 августа
• NodeSchool в Тюмени 1 сентября
• FrontTalks в Екатеринбурге 14–15 сентября
• Moscowcss 9 в Москве 2 октября
Подкастинг
• Podcasting on WordPress.com
• CSSSR: Новости 512
• SPB Frontend Drinkcast
Новинки браузеров
• Firefox 61
• Release Notes for Safari Technology Preview 62
• Blink: Intent to Deprecate and Remove
Уязвимость в React и не только
• React v16.4.2: Server-side vulnerability fix
Неправильный пайплайн
• I think TC39 is making a mistake…
Подгриды готовы
• CSS Grid Level 2 updated Working Draft
Сложная галерея Google
• Как мы делали веб-интерфейс для Google Photos
Веб-компоненты
• The Case for React-like Web Components
• Web Components in 2018
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:28 События
00:07:30 Chrome 68
00:11:05 Опасный HTTP
00:17:18 React или jQuery
00:38:12 Вы не знаете инлайн-блоки
00:44:59 Иллюстрированные флексы
00:49:58 Курсы на английском
00:52:33 Опасные пресеты Babel
00:57:52 Браузеры мешают JS
События
• FreeCodeCamp в Москве
• WSD в Питере 18 августа
• Приём докладов до 3 августа
• Krasnodar Dev Days #3 в Краснодаре 15 сентября
• Frontend Conf Moscow в Москве 4–5 октября
• Fronteers в Амстердаме 4–5 октября
• EmberFest в Амстердаме 11–12 октября
Chrome 68
Опасный HTTP
• A milestone for Chrome security: HTTP as not secure
React или jQuery
• Github.com отказывается от jQuery
• React is The New jQuery
• React — это не новый jQuery
Вы не знаете инлайн-блоки
• Удивительный и неизвестный inline-block
Иллюстрированные флексы
• The Complete Illustrated Flexbox Tutorial
• MDN: justify-self
Курсы на английском
• Hello, animation!
• Все курсы HTML Academy
Опасные пресеты Babel
• Removing Babel’s Stage Presets
Браузеры мешают JS
Ведущие: Сергей Бережной, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:39 События
00:03:38 Неудобные классы и всякий JS
00:28:10 Манифест на лету
00:33:19 Гриды с ошибками
00:40:02 Плохой лэндинг хорошей ШРИ
События
• Видео с UralJS в Екатеринбурге 5 июля
• Do moral Code meetup #2 во Львове 27 июля
• Яндекс Субботник в Минске 27 июля
• БЭМап в Питере 12 августа
• WSD в Питере 18 августа
Неудобные классы и всякий JS
• Классы, сложность и функциональное программирование
• What’s Happening With the Pipeline (|>) Proposal?
• Guppy: friendly app manager and task runner for React
• An introduction to the JavaScript MutationObserver API
Манифест на лету
• PWACompat: the Web App Manifest for all browsers
Гриды с ошибками
• 9 Biggest Mistakes with CSS Grid
• Should I try to use the IE version of Grid Layout?
Плохой лэндинг хорошей ШРИ
• Школа разработки интерфейсов Яндекса
• Div class="text" У меня всё
• Ссылки, на которые полезно кликнуть div
• Девшахта №11: ШРИ Яндекса
• Ночной фронтенд №37: ШРИ Яндекса. Итоги
Ведущие: Лера Зелёная, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:02:12 События
00:04:36 Вирус в npm
00:10:54 Зачем Feature Policy
00:18:45 Случай в Atom
00:23:36 Мёртвый код
00:30:19 Разделение ответственности
00:36:05 Стрелка или пальчик
События
• SPB Frontend в Питере 17 июля
• WSD в Питере 18 августа
• LvivCSS 2018 во Львове 10–11 ноября
Вирус в npm
Зачем Feature Policy
• Introduction to Feature Policy
Случай в Atom
Мёртвый код
• Reduce JavaScript Payloads with Tree Shaking
Разделение ответственности
• Компоненты и разделение ответственности
Стрелка или пальчик
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:21 События
00:05:03 React это просто JS
00:10:42 Вложенность в CSS
00:16:34 Система отступов
00:25:06 Недоступная капча
00:29:25 Забудьте про гриды в IE
00:47:39 Верстальщик против визивига
События
• SPB Frontend в Питере 17 июля
• Я.Субботник в Минске 28 июля
• WSD в Питере 18 августа
React это просто JS
• React is just JavaScript
• The Beginner’s Guide to React
Вложенность в CSS
• Request to pick up the CSS nesting proposal
• CSS Nesting Module Level 3
• А смысл, если есть препроцессоры?
Система отступов
• Spacings and CSS Custom properties
• Зачем нужны кастомные свойства?
• Старая тема Material на Sass
Недоступная капча
• ReCAPTCHA v3
• Inaccessibility of CAPTCHA, W3C WD
Забудьте про гриды в IE
• Debunking Common IE Grid Misconceptions
• CSS Grid and the New Autoprefixer
• Faking an Auto-Placement Grid with Gaps
• Андрей Ситник: Рейчел не позволила
• CSS Grid Level 2: Here Comes Subgrid
Верстальщик против визивига
• WiX
• Tilda
• Adobe Muse
Ведущие: Вадим Макеев, Аня Селезнёва, Иван Акулов
Темы
00:00:00 Интро
00:02:49 События
00:06:51 Доклады на BeerJS
00:25:47 Графика в интернете
00:35:29 Шрифты в SVG
00:43:51 Исчезающие фреймворки
00:49:20 Модули ES2015+
00:55:01 Див не кликается
00:59:49 Почему CSS такой
События
• UralJS в Екатеринбурге 5 июля
• FreeCodeCamp №21 в Москве 22 июля
• Приём докладов на 404fest в Самаре 6–7 октября
• CSS-Minks-JS в Минске 21–22 сентября
Доклады на BeerJS
• BeerJS Summit в Минске 30 июня
• Essential Image Optimization
• Decrease Front-end Size
• Don’t Guess it, Test it!
• Grammarly
Графика в интернете
• Состояние дел в вебе: стратегии оптимизации изображений
• Современный интернет в одном видео
Шрифты в SVG
• Using Custom Fonts With SVG in an Image Tag
• Веб в кривых. Второе рождение SVG
• SVG vs PNG
Исчезающие фреймворки
• Исчезающие фреймворки
• Computer, build me an app
Модули ES2015+
• On Consuming (and Publishing) ES2015+ Packages
Див не кликается
• JS click event bubbling on iOS
• Жми сюда!
Почему CSS такой
• Resilient, Declarative, Contextual
• Устойчивый, декларативный, контекстный
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:30 Как нас слушать
00:02:59 События
00:08:09 Web Animations API
00:19:33 Вариативные шрифты
00:25:54 Keyframes.app
00:28:59 ARIA: Hidden или None
00:37:27 Плохой placeholder
00:44:52 Доступный React
00:50:57 Спонсор
Как нас слушать
• Google Podcasts для Android
• Apple Podcasts для iOS
• Фид со всеми выпусками
• Плейлист на Ютубе
• Выпуски в Телеграме
• Выпуски в ВК
События
• RamblerFront& #5 в Москве 28 июня
• React SPB Meetup #1 в Питере 4 июля
• Moscow Vue.js Meetup #2 в Москве 5 июля
• KharkivFrontend Summer Conference в Харькове 22 июля
• Фестиваль 404 в Самаре 6–7 октября
• Web Standards Days
• [email protected]
Web Animations API
• Release Notes for Safari Technology Preview 59
• Web Animations in WebKit
• CSS media query for Mojave’s Dark Mode
• Responsive Design for Motion
Вариативные шрифты
Keyframes.app
ARIA: Hidden или None
• Know your ARIA: hidden vs none
Плохой placeholder
• Don’t Use The Placeholder Attribute
Доступный React
Спонсор
Ведущие: Мария Аникеева, Вадим Макеев, Алексей Симоненко, Сергей Попов
Темы
00:00:00 Интро
00:00:52 Все события до конца года
00:31:40 Впечатления с pitercss_conf
Все события до конца года
• ChernivtsiJS в Черновцах 23 июня
• MinskCSS Workshop #1: BEM в Минске 24 июня
• HighLoad++ Siberia в Новосибирске 25–26 июня
• NodeSchool №4 в Новосибирске 30 июня
• BeerJS Summit в Минске 30 июня
• OdessaJS в Одессе 6–8 июля
• 404 Camp в Самаре, 27–29 июля
• ULCamp в Ульяновске 27–29 июля
• IT Global Meetup #13 в Питере 28 июля
• Классический ULCamp 2013
• Frontend Conference в Цюрихе 30–31 августа
• IT-фестиваль TechTrain в Питере 1–2 сентября
• Nordic.js в Стокгольме 6–9 сентября
• FrontTalks в Екатеринбурге 14–15 сентября
• Inhuman UI, Vadim Makeev
• CSS-Minsk-JS в Минске 21–21 сентября
• FrontendConf в Москве 4–5 октября
• KharkivJS в Харькове 5–6 октября
• Фестиваль 404 в Самаре 6–7 октября
• HolyJS в Москве 24–25 ноября
• JSConf AM в Ереване
Впечатления с pitercss_conf
• Pitercss_conf в Питере 8–9 июня
• Community tickets
• Инстаграм pitercss_conf
• Pitercss_conf в YouTube
• Отчёт Андрея Мелихова на Дев Шахте
• Видео открытия pitercss_conf
• Фото: первый день в Фейсбуке
• Фото: второй день в Фейсбуке
• Фото: первый день в ВК
• Фото: второй день в ВК
Ведущие: Вадим Макеев, Мария Просвирнина, Андрей Ситник
Темы
00:00:00 Интро
00:00:34 События
00:05:31 Гитхаб продался
00:20:44 Safari в часах
00:38:25 Доступные карточки
00:45:43 Разная сложность кода
00:58:45 Конец cssnext
События
• Pitercss_conf в Питере 8–9 июня
• DEVNSK Frontend Meetup №3 в Новосибирске 16 июня
• WebDev Meetup #4 в Тольятти 16 июня
• BeerJS Summit в Минске 30 июня
Гитхаб продался
• Microsoft + GitHub = Empowering Developers
• Microsoft has reportedly acquired GitHub
• Microsoft acquiring GitHub is a good thing. Here’s why
• What is wrong with Microsoft buying GitHub
• Microsoft купила GitHub. Это хорошо? Это плохо? Все испортится? Что будет дальше?
Safari в часах
• What’s new in Safari 12
• Designing Web Content for watchOS
• Web Watch
• CSS Round Display L1
Доступные карточки
Разная сложность кода
• CSS Subgrid JS polyfill
• SPB Frontend Drinkcast: Грустный
Конец cssnext
• The color function is renamed to color-mod
• Deprecating cssnext
• PostCSS Preset Env
• Tab Atkins
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События, YaC и WWDC
00:12:52 Новинки Chrome, Edge и Firefox
00:24:45 Вложенность, calc и CSS-хакеры
00:38:26 Как писать код быстро
00:43:16 Вариативные шрифты
00:48:13 Await и ES-модули
00:57:00 Есть ли зверь фулстек
01:09:24 Яндекс Лэндинги
События, YaC и WWDC
• CodeEvening MeetUP в Нефтекамске 2 июня
• North-East FrontEnd Talks в Москве 7 июня
• Pitercss_conf в Питере 8–9 июня
• FrontCon в Риге 14–15 июня
• FreeCodeCamp №20 в Москве 17 июня
• Insider Dev Tour в Питере 27 июня
• YaC: Большие новости большой конференции
• WWDC 2018 4 июня
Новинки Chrome, Edge и Firefox
• Chrome 67
• Chrome 67: What’s New in DevTools
• Edge: WebP in development
• Can I Use: WebP
• Can I Use: WebM
• Shadow DOM in Firefox Nightly
• MDN: Using shadow DOM
Вложенность, calc и CSS-хакеры
• Request to pick up the CSS nesting proposal
• Майские новинки CSS
• [CSS is so overpowered it can deanonymize Facebook users](CSS Is So Overpowered It Can Deanonymize Facebook Users)
Как писать код быстро
• Text editing techniques every Front-End developer should know
Вариативные шрифты
• How to start with variable fonts on the web
Await и ES-модули
• Top-Level Await 2: still awaiting
• Since today we support the import.meta proposal in Firefox Nightly
Есть ли зверь фулстек
• There’s no such thing as a full stack developer
Яндекс Лэндинги
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Швайка
Темы
00:00:00 Интро
00:01:05 События
00:03:41 Кроссбраузерный Google
00:07:43 Что обсуждал TC39
00:17:39 Генерация SVG
00:29:00 Новинки и проблемы React
00:49:24 Якорь по CSS-селектору
00:57:06 Танцующие скелеты
01:00:57 Высокоуровневые API
События
• Frontend Conf в Москве 28–29 мая
• AmsterdamJS в Амстердаме 31 мая–1 июня
• CSSconf EU в Берлине 1 июня
• JSConf EU в Берлине 2–3 июня
• Pitercss_conf в Питере 8–9 июня
Кроссбраузерный Google
• Firefox is now supported by Google Hangouts and Meet
Что обсуждал TC39
• TC39 64th meeting
• Don’t go and actively try to make things harder
Генерация SVG
• Dynamic Bézier Curves
• Cubic Bezier
• Easing Functions
• KaTeX
Новинки и проблемы React
• React v16.4.0: Pointer Events
• React-pointable
• React: Web Components
• Custom Elements Everywhere
• React is the new jQuery
Якорь по CSS-селектору
• Supporting CSS selectors when navigating to a URL fragment
Танцующие скелеты
• Real-time Human Pose Estimation in the Browser with TensorFlow.js
Высокоуровневые API
• BlinkOn 9: Layered web APIs
• Remove the storage mutex
• React-virtualized
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:17 События
00:12:08 Что за GDPR
00:16:05 Про браузеры
00:33:18 CSS — это дизайн
00:42:58 Движение по кривой
00:49:36 Все пробелы
00:56:49 Динамический NodeList
01:02:38 Критика CSS-in-JS
01:18:12 Синдром устаревания
01:24:27 Спонсор: нессылки
События
• HolyJS в Питере 19–20 мая
• React Moscow Meetup 4 в Москве 23 мая
• YGLF в Киеве 24–25 мая
• ReasonDojo в Москве 27 мая
• Pitercss_conf в Питере 8–9 июня
• Друзья на Фонтанке 10%
• Виталий Фридман в Питере 10 июня
Про браузеры
• Safari Technology Preview 56
• Камень в лесу
• New in Firefox 61: Developer Edition
• Introducing the Microsoft Edge DevTools Protocol
• Evolving Chrome’s security indicators
• Reverting the autoplay block for Web Audio
CSS — это дизайн
• CSS — это дизайн!
• Веб-дизайнеры, начните верстать!
Движение по кривой
• Движение по траектории в CSS помимо «большой тройки» свойств
Все пробелы
• Пробелы
• Брюс Лоусон
• Справочник издателя и автора
• Типографская раскладка Бирмана
Динамический NodeList
• Use querySelectorAll, people!
Критика CSS-in-JS
• What’s wrong with CSS-in-JS?
• What’s right with CSS-in-JS
• CSS-in-JS
• My struggle to learn React
Синдром устаревания
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:17 События
00:04:51 Firefox 60
00:14:51 Google I/O
00:35:55 Авторитарный кодстайл
00:46:33 Оптимизация JS с Prepack
01:02:46 CSS справа налево
01:09:57 Спонсор выпуска
События
• Pitercss_meetup в Питере 16 мая
• FreeCodeCamp #19 в Москве 20 мая
• ITsubbotnik в Москве 26 мая
• Frontend Conf в Москве 28–29 мая
• ITweekend в Самаре 2–3 июня
• Pitercss_conf в Питере 8–9 июня
• Мастер-класс Виталия Фридмана 10 июня
Firefox 60
• Firefox 60, Марат Таналин
• Firefox 60 for Developers
• Firefox 60 – Modules and More
Google I/O
• Google I/O Developer Roundup: What’s New?
• Let’s Encrypt Stats
• Using Lighthouse To Improve Page Load Performance
• Announcing Lighthouse 3.0
• Lighthouse CI
• Material Design
• Material Design Gallery
Авторитарный кодстайл
• Карательные инструменты во фронтенде
• Prettier
Оптимизация JS с Prepack
• A Gentle Introduction to Prepack
• Prepack
CSS справа налево
• Что такое dir=rtl и как приручить арабский язык
Спонсор выпуска
• CSS Grid Resources & Tools
• Is your web page mobile-friendly?
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:21 События
00:08:26 Возвращение Dojo
00:16:52 BigInt в JS
00:23:54 Safari почти догнал
00:35:40 CSS-меню и подгриды
00:49:36 HTTPS на GitHub Pages
00:59:04 Ошибки дизайнеров
События
• PiterJS №25 в Питере 10 мая
• Pitercss_meetup №22 в Питере 16 мая
• HolyJS Piter в Питере 19–20 мая
• FrontDays в Тольятти 26 мая
• Krasnodar Frontend Meetup #3 в Краснодаре 2 июня
• ITweekend в Самаре 2–3 июня
• Google I/O
Dojo 2 и Edge 17
• Electron 2
• Angular 6
• Dojo 2
• What’s new in EdgeHTML 17
• Is service worker ready?
BigInt в JS
• Google Developers: BigInt
• TC39: BigInt
Safari почти догнал
• Release Notes for Safari TP 55
• Visualizing Layers in Web Inspector
• WebExtensions
• Video Speed Controller
• Add to Things
• ContentEditable
CSS-меню и подгриды
• Solved With CSS! Dropdown Menus
• CSS Selectors Level 4
• Grid Level 2 and Subgrid
HTTPS на GitHub Pages
• Custom domains on GitHub Pages gain support for HTTPS
• meowni.ca
• jakearchibald.com
• una.im
Плохой верстальщик
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:11:44 Node.js 10 и npm 6
00:27:34 Google Fonts и HTTPS
00:39:17 Фолбэки для гридов
00:42:31 ФП или ООП
00:53:12 Хабр по-английски
00:57:46 Заголовки для SPA
События
• PiterJS №25 в Питере 10 мая
• MinskJS Meetup #4 в Минске 24 мая
• Front-Trends в Варшаве 24–25 мая
• YGLF в Киеве 24–25 мая
• Frontend Conf в Москве 28–29 мая
• Pitercss_conf в Питере 8–9 июня
• React Ekaterinburg
Node.js 10 и npm 6
• The Node.js Project Introduces Latest Release Line: Node.js 10.x
• Announcing npm@6
Google Fonts и HTTPS
• Google Webfonts Helper
• Google Security: Distrust of the Symantec PKI
• How HTTPS works
Фолбэки для гридов
ФП или ООП
• Можно ли избежать функционального программирования?
Хабр по-английски
Заголовки для SPA
• Managing Heading Levels In Design Systems
• Самый плохой SPA в интернете
Ведущие: Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:02:27 События
00:05:06 Sketch в Avocode
00:10:38 Новые операторы в ES
00:20:39 Флоаты, флексы и гриды
00:32:56 Кастомные элементы форм
00:37:13 Стиль кода в React
00:43:35 Трюки с прокруткой
События
• React Finland в Хельсинки 24–26 апреля
• JavaScript Party в Новосибирске 24 апреля
• Pitercss_meetup в Питере 26 апреля
• Fronteers в Амстердаме 4–5 октября
• Pitercss_conf в Питере 8–9 июня
Sketch в Avocode
• Open and inspect Sketch designs on Windows, Linux, and macOS
Новые операторы в ES
• Операторы ?., ?? и |>, которые вам понравятся
Флоаты, флексы и гриды
• How browsers position floats
• Flexbugs
• A Collection of Interesting Facts about CSS Grid Layout
• Another Collection of Interesting Facts About CSS Grid
• HTML Шорты: Сокращённые свойства
Кастомные элементы форм
• API for submitting custom elements
Стиль кода в React
• React Code Style Guide
• React Patterns
• react-bits
• react-in-patterns
Трюки с прокруткой
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:01:37 События
00:04:16 CSS и дерево доступности
00:12:41 Разработка по TDD
00:22:05 Все недовольны W3C
00:24:30 Зачем сервис-воркеры
00:32:04 Гриды и новый дизайн
События
• UralJS #7 в Екатеринбурге 19 апреля
• FRONTday #8 в Челябинске 20 апреля
• EPAM INSIDER в Нижнем Новгороде 21 апреля
• OrelJS Meetup в Орле 21 апреля
• Я.Субботник в Москве 21 апреля
• Pitercss_meetup №21 в Питере 26 апреля
• Pitercss_conf в Петербурге 8–9 июня
CSS и дерево доступности
• Feature Queries Manager
• Just had a play with Firefox A11y Tree viewer
• Introducing the A11y Inspector in the Firefox DevTools
Разработка по TDD
• Крестики-нолики по TDD
• Итальянская забастовка
Все недовольны W3C
• Everyone formally object to the advancement of the W3C fork
• Противостояние W3C и WHATWG
• Changing the copyright license for Living Standards
Зачем сервис-воркеры
• Генерация страниц сайта средствами сервис-воркеров
Гриды и новый дизайн
• Whitespace on The Web with CSS Grid
• Режимы наложения + гриды
Ведущие: Игорь Алексеенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:01:00 События
00:02:13 Новинки Safari и Chrome
00:15:35 Ruby Sass всё
00:20:09 Логические CSS-свойства
00:28:47 Доступные таблицы
00:41:59 Неправильные классы и const в JS
События
• BeerJS #1 в Челябинске 12 апреля
• Pitercss_meetup №21 в Питере 26 апреля
• Pitercss_meetup №22 в Питере 16 мая
• Moscowcss в Москве 15 мая
Новинки Safari и Chrome
• Safari TP 53
• Introducing the Payment Request API for Apple Pay
• Present web pages to secondary attached displays
• Let’s play with Chrome’s Face Detection API
Ruby Sass всё
Логические CSS-свойства
• Understanding Logical Properties And Values
• PostCSS-RTL
Доступные таблицы
Неправильные классы и const в JS
• Классы и фабричные функции в JS. Что выбрать?
• Задолбало противопоставление хренова const чёртову let
• Const в JS делает свою работу правильно!
Ведущие: Вадим Макеев, Мария Просвирнина, Алексей Симоненко
Темы
00:00:00 Интро
00:00:57 События
00:03:29 Safari 11.1 и 20 лет Mozilla
00:21:11 Спеки CSS и доверие к W3C
00:34:21 Нюансы display: contents
00:36:47 Выравнивание текста
00:42:24 ES-модули уже здесь
00:52:52 Новинки WebStorm
01:05:15 React v16.3.0
01:08:42 V8 и веб-сокеты в Node.js
01:16:28 Картина отрасли
События
• Фронтенд-митап Райффайзенбанка в Москве 28 марта
• Tinkoff Angular Meetup в Москве 4 апреля
• Nsk Tech Talks #2 в Новосибирске 5 апреля
• BEMup для новичков в Москве 8 апреля
• SPA Meetup #4 в Москве 7 апреля
• React Amsterdam в Амстердаме 13 апреля
• React Finland в Хельсинки 24–26 апреля
Safari 11.1 и 20 лет Mozilla
• What’s New in Safari 11.1
• Progressive Web Apps on iOS are here
• Safari 11.1 displays Website Not Secure on HTTP login pages
• Stable Browser font-display alert
• Веб-истории: Браузерные войны
• IRL Podcast
Спеки CSS и доверие к W3C
• CSS-2018: каким возможностям дать «зелёный свет»
Нюансы display: contents
Выравнивание текста
• Cropping Away Negative Impacts of Line Height
ES-модули уже здесь
• Глубокое погружение в ES-модули в картинках
• ES modules for dedicated workers in Chromium
• Workbox
Новинки WebStorm
• New for JS developers in WebStorm and IntelliJ IDEA 2018.1
• Работаем с Git не выходя из WebStorm
React v16.3.0
• React v16.3.0: New lifecycles and context API
• Sneak Peek: Beyond React 16
V8 и веб-сокеты в Node.js
• V8 release v6.6
• Node.js is considering adding built-in WebSockets support
Картина отрасли
• Исследование HackerRank о рынке разработчиков 2018
• Stack Overflow: Developer Survey Results 2018
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:00:15 События
00:02:54 Новинки браузеров
00:19:01 Дизайн для верстальщиков
00:26:20 Vue.js и курсы по JS
00:35:46 Что такое AMP
События
• Pitercss_meetup в Питере 27 марта
• RamblerFront& #4 в Москве 29 марта
• FRONTday #7 30 марта в Челябинске
• KharkivFrontend Meetup #_3 в Харькове 1 апреля
• PiterJS №24 в Питере 11 апреля
Новинки браузеров
• Safari Technology Preview 52
• Clipboard API Improvements
• Unblocking Clipboard Access
• Chrome 66 Beta
Дизайн для верстальщиков
• Optical adjustments in components
• Google Material Design: Color
Рецепты Vue.js и JS-курсы
• Vue.js Cookbook
• Видео с Vue.js Moscow Meetup #1
• Автор интенсивных курсов по JS в HTML Academy
• Старикам здесь не место?
• Новый курс «JavaScript в браузере»
• Бесплатный курс «Знакомство с JavaScript»
Что такое AMP
• Accelerated Mobile Pages
• How Fast Is Amp Really?
• Standardizing lessons learned from AMP
• Overview of web standards and features related to AMP
Ведущие: Вадим Макеев, Мария Просвирнина, Зарема Халилова
Темы
00:00:00 Интро
00:05:15 События
00:08:24 Новинки Firefox 59
00:13:48 SEO для JS
00:27:59 Webpack без SPA
00:37:59 Гудини для CSS
00:45:57 Сортировка DOM
00:51:19 Шрифты без лишнего
События
• SECON в Пензе 16–17 марта
• YGLF в Киеве 24–25 мая
• 15% скидка на YGLF: wstspring
Новинки Firefox 59
SEO для JS
• Руководство по SEO JS-сайтов: Интернет глазами Google
• Руководство по SEO JS-сайтов: Проблемы, эксперименты и рекомендации
• Features not supported by Google bot
Webpack без SPA
• Простой статический сайт на Webpack 4
Гудини для CSS
• Say Hello to Houdini and the CSS Paint API
Сортировка DOM
• DOM API for sorting siblings
Шрифты без лишнего
Ведущие: Ольга Алексашенко, Вадим Макеев, Мария Просвирнина, Артур Столяр
Темы
00:00:00 Интро
00:00:42 События
00:03:20 Новые подкасты
00:07:20 Новинки Chrome 65
00:14:32 Надёжная случайность
00:21:45 Смушгейт и MooTools
00:28:28 Webpack и Make
00:37:19 История CSSO
00:42:54 Кому нужны PWA
События
• PiterJS №23 в Питере 17 марта
• MinskCSS Meetup 4 в Минске 22 марта
• SPB Angular Meetup в Питере 22 марта
• Pitercss_meetup №20 в Питере 27 марта
• FRONTday #7 в Челябинске 30 марта
• ChernivtsiJS в Черновцах 23 июня
Новые подкасты
• Веб-истории
• Code и фичер
Новинки Chrome 65
Надёжная случайность
Смушгейт и MooTools
Webpack и Make
• On-Demand-Loading of separated CSS
• The Lost Art of the Makefile
История CSSO
• История оптимизатора CSSO: Начало
• История оптимизатора CSSO: Продолжение
• История оптимизатора CSSO: Завершение
• История оптимизатора CSSO: Выводы
• CSS глазами машин
Кому нужны PWA
Ведущие: Ольга Алексашенко, Евгений Гусев, Вадим Макеев, Мария Просвирнина
Темы
00:00:00 Интро
00:01:07 События
00:03:53 Для дизайнеров
00:07:21 Зачем CSS-переменные
00:22:06 Очень опасный CSS
00:27:31 Выражения от контейнера
00:36:10 Webpack быстрее на 146%
00:46:50 Перезапуск Dart 2.0
События
• PiterJS №23 в Питере 17 марта
• Epam JavaScript Meetup в Питере 20 марта
• Pitercss_meetup №20 в Питере 27 марта
Для дизайнеров
• Полезное дизайнеру и разработчику
Зачем CSS-переменные
• Изучите CSS-переменные за 5 минут
• Learn CSS Variables for free
• Stunning hover effects with CSS variables
• Время переменных
• Google Search crawler is based on Chrome 41
• PageSpeed Insights
• Browserslist
Очень опасный CSS
Выражения от контейнера
• Решение проблемы выражений от контейнера
Webpack быстрее на 146%
Перезапуск Dart 2.0
• Анонс Dart 2.0
• Список ресурсов русскоязычного сообщества Dart
Ведущие: Мария Просвирнина, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:02:52 Где нас слушать
00:07:01 События и завтраки
00:18:11 Старые и новые движки
00:29:48 Npm догнал yarn
00:41:31 Гриды на пустом месте
00:45:53 Кастомные или системные шрифты
00:53:44 Устаревшие рекомендации
01:07:29 Опасные алиасы в консоли
Где нас слушать
• SoundCloud
• RSS-фид
• iTunes для Windows и macOS
• Pocket Casts для iOS, Android и браузера
• Podcasts для iOS
• Overcast для iOS
• Castbox для Android
События и завтраки
• OdessaFrontend Code в Одессе 28 февраля
• MoscowJS в Москве 1 марта
• Необычный Javascript в Нижнем Новгороде 1 марта
• FrankenJS Meetup в Нюрнберге 19 марта
• Moscow Vue.js Meetup в Москве 22 марта
• Web Not Bombs: Morning Talks в Минске 25 марта
• Pitercss_conf в Петербурге 8—9 июня
Старые и новые движки
• Safari: Introducing Storage Access API
• Браузер != Браузерный движок
Npm догнал yarn
• npm 5.7.0
• Critical Linux filesystem permissions are being changed
Гриды на пустом месте
• Styling Empty Cells With Generated Content
Кастомные или системные шрифты
• Shipping system fonts to GitHub.com
• Fontastic Web Performance
Устаревшие рекомендации
• To optimize code for machines use a CSS minifier
• Google HTML/CSS Style Guide
• HTML Шорты: Сокращённые свойства
Опасные алиасы в консоли
Ведущие: Мария Просвирнина, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:08:04 Новый фид подкаста
00:11:46 Эксперименты и основы вёрстки
00:20:51 Перегретая зарплата
00:30:12 PWA на десктопе
00:46:02 ECMAScript 3000
01:00:15 Vue.js вместо jQuery
01:11:30 Node.js 10
События
• БЭМап в Москве 2 марта
• Дизайн-перемена Яндекса
• SPB Frontend в Питере 21 февраля
• React Amsterdam в Амстердаме 13 апреля
• FreeCodeCamp в Москве 18 февраля
Новый фид подкаста
• Новый RSS-фид
• Репозиторий подкаста
Эксперименты и основы вёрстки
• Variable Order
• Ссылки против кнопок в веб-приложениях
• Styling Links
• Font Fallback
• Multiple Backgrounds
• Second S in CSS
• Fallback Colors
Перегретая зарплата
PWA на десктопе
• PWA on Desktop
• Welcoming PWA to Edge and Windows 10
ECMAScript 3000
• ECMAScript 2018 RC
• Async iterators and generators
• Object rest and spread properties
• Promise.prototype.finally
• ECMAScript regular expressions are getting better!
• Class field declarations for JavaScript
• ES proposal: String.prototype.matchAll
Vue.js вместо jQuery
• Replacing jQuery With Vue.js: No Build Step Necessary
• Svelte
Node.js 10
Ведущие: Юрий Федоренко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:02:03 События
00:07:16 CSS на JS в Chrome
00:21:56 HTTPS и SEO
00:31:39 Сервис-воркеры в Safari
00:35:55 Маркетинг CSS
00:43:06 Собеседования
События
• KharkivFrontend Meetup #2 в Харькове 17 февраля
• Frontend Conference в Цюрихе 30–31 августа
• PiterJS в Питере 15 февраля и 17 марта
• NodeSchool в Питере 17 февраля и 24 марта
• SPB Frontend в Питере 21 февраля
• Календарь событий по фронтенду
• OdessaFrontend
CSS на JS в Chrome
• Chrome 65 Beta
• Circle Chart
HTTPS и SEO
• A secure web is here to stay
• Not Secure warnings for HTTP in Firefox 59+
• Analyse your HTTP response headers
Сервис-воркеры в Safari
• Release Notes for Safari TP 49
• Workers at Your Service
Маркетинг CSS
• Mozilla: Your CSS Wishlist?
• Firefox Platform Status
• WebKit Feature Status
• Chrome Platform Status
• Microsoft Edge Developer
Собеседования
• Компьютерная школа Hillel
• Как пройти собеседование по JS?
• Телеграм: Мы вам перезвоним
Ведущие: Алекс Могилевский, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:02:40 События
00:07:16 Возвращение из Америки
00:12:58 Фронтенд и боль
00:22:24 Цикличность в CSS
00:41:04 История флексов
00:51:53 PWA в Safari
01:02:24 Как случился Edge
События
• AmsterdamJS в Амстердаме 1 июня
• Почта [email protected], тема AmsterdamJS
• JS Party в Новосибирске 13 февраля
• PiterJS #22 в Питере 15 февраля
• RND.JS #5 в Ростове-на-Дону 18 февраля
• ngVikings в Эспоо 1–2 марта
• Moscowcss 7 в Москве 6 марта
• JS Fest в Киеве 30–31 марта
• React Finland в Хельсинки 24–26 апреля
Возвращение из Америки
Фронтенд и боль
Цикличность в CSS
• Circularity and Container Queries
• CSS Module Timelines
• CSSWG FAQ
История флексов
• Flexible Box Layout Module, 2009
PWA в Safari
• PWA on iOS: Cupertino, we have a problem
Как случился Edge
Ведущие: Мария Просвирнина, Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:01:13 События
00:04:11 Браузеры
00:21:52 Bootstrap 4
00:28:04 WebStorm и CSS
00:34:14 БЭМ для начинающих
00:44:03 Ненужный атрибут title
00:50:17 Выражения от контейнера
00:54:59 Веб-стандарты на Литресе
00:57:21 Миру мир
События
• SPB Frontend Drinkup в Питере 30 января
• Три видео с MinskJS
• Ha.js в Хабаровске 3 февраля
• UralJS в Екатеринбурге 8 февраля
• AmsterdamJS в Амстердаме 1 июня
Браузеры
• Safari 11.1
• Betas of iOS 11.3 and macOS 10.13.4 are out
• Firefox 58, Марат Таналин
• The Quantum Era Continues
• New in Chrome 64
• Watch your back, Browser! You’re being observed
Bootstrap 4
• Bootstrap 4
• Should I try to use the IE implementation of CSS Grid Layout?
WebStorm и CSS
БЭМ для начинающих
Ненужный атрибут title
• The Trials and Tribulations of the Title Attribute
Выражения от контейнера
• Use Cases and Requirements for Element Queries
Веб-стандарты на Литресе
• Все книги серии «Веб-стандарты»
Миру мир
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:35 События
00:03:44 Селектор matches
00:05:11 Гриды для бизнеса
00:31:17 Нейровёрстка
00:45:16 Согласие по main
00:49:32 Общие JS-модули
00:54:32 Шортики и уважение
События
• pitercss_meetup №18 в Питере 24 января
• WSD в Москве 3 февраля
• MinskJS в Минске 25 января
• Rolling Scopes в Минске 10–11 февраля
• Frontend Meetup №1 в Новосибирске 3 февраля
• CodeFest в Новосибирске 31 марта—1 апреля
• NodeSchool SPb в Питере 17 февраля
• DUMP и FrontTalks в Екатеринбурге 13 апреля
Селектор matches
• Complex CSS Selectors Inside Selectors
Гриды для бизнеса
• Learn all about CSS Grid
• Layout Land: Season One
• CSS Grid + CSS Multi-Columns
• Профессиональный HTML и CSS 2 уровня
Нейровёрстка
• Turning Design Mockups Into Code With Deep Learning
Согласие по main
• Restrict the main element to be used once
• Consider aligning main element definition
Общие JS-модули
• ESM modules in node: npm edition
Шортики и уважение
Ведущие: Андрей Саломатин, Вадим Макеев
Темы
00:00:00 Интро
00:02:13 События
00:05:39 Браузеры и интерфейсы
00:29:57 Что-то помню, где искать?
00:32:46 Точка с запятой в JS
00:43:54 Выравнивание в CSS
01:02:47 Трюки Сары с SVG
01:07:57 Управление проектами
01:24:38 Фронтендер в Берлине
События
• PiterJS в Питере 18 января
• Я.Субботник в Нижнем Новгороде 20 января
• Pitercss_meetup в Питере 24 января
• MinskJS в Минске 25 января
• WSD в Москве 3 февраля
Браузеры и интерфейсы
• Intent to Implement :matches()
• Enable Custom Elements v1
• Enable script type="module"
• Building Bridges, WarsawJS
• Code Podcast: Don’t make me write UI!
• CSS Houdini
Что-то помню, где искать?
Точка с запятой в JS
• Hazard of Automatic Semicolon Insertion
• Prettier
• JavaScript Standard Style
• Airbnb JavaScript Style Guide
Выравнивание в CSS
Трюки Сары с SVG
• Optimizing SVG Text & Image Delivery with Inline SVG
• Cropping & Scaling Images Using SVG Documents
Управление проектами
• Systems thinking in management
Фронтендер в Берлине
Ведущие: Роман Комаров, Вадим Макеев
Темы
00:00:00 Интро
00:01:59 События
00:04:12 Эксперименты с CSS
00:44:30 Развитие спецификаций
01:08:32 Компонентный CSS
События
• Pitercss_meetup №18 в Питере 24 января
• WSD в Москве 3 февраля
• AmsterdamJS в Амстердаме 1 июня
Эксперименты с CSS
• Бесчеловечные эксперименты над CSS
• Инструменты для экспериментов
• Flexible Overflow
• Counters and Stones
• Castle of Sinister Sorcerers
• Zen Coding 2.0. Концепт
• Hayaku
Развитие спецификаций
• Математика CSS-шлюзов
• Re-adding min() and max()?
• Native interpolation function in CSS
• CSS conic-gradient() polyfill
• Change the pointer cursor to indicate any interactive element
• Move to WICG to get more traction?
• The RGB hexadecimal notations
Компонентный CSS
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:03:08 Как отмечаем НГ
00:17:35 Звёздные войны
00:34:04 Новогодний стол
00:44:04 Про книги
00:57:24 Дж. Р. Р. Толкин
01:05:46 Про сериалы
01:24:41 Закругляемся
01:28:24 Песня
Как отмечаем НГ
• David Bowie Year by Year
• Do Make Say Think
• Terminal Bar на Белинского
Звёздные войны
Осторожно, спойлеры!
• Star Wars: The Last Jedi Trailer
• Зубастики
• All Changes Made to Star Wars
• Nosferatu (1922)
Новогодний стол
Про книги
• Продолжение Звёздных войн
• Дилемма инноватора
• Sapiens. Краткая история человечества
• Орфография
• Вся кремлёвская рать
• Донна Тартт
• Никколо Амманити
• Лёха Андреев
• Град обреченный
• Князь Света
Дж. Р. Р. Толкин
Про сериалы
• Хороший доктор
• Гоморра
• Нарко
• Государство у Чарльза Тилли
• Табу
• Рассказ служанки
• Хранители
• Охотник за разумом
• Метод
• Троцкий
Закругляемся
Песня
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 Юбилей
00:13:36 Зачем события
00:16:45 Что изменилось за два года
00:28:29 Новости недели
00:38:35 Фронтенд в 2017 году
00:44:32 Новые форматы новостей
00:54:57 Кому молодых фронтендеров?
Юбилей
• Добролёт
• Пилотный выпуск №1
• Выпуск №65 с Виталием Слободиным из PhantomJS
Зачем события
• Промокод wst для YGLF Kyiv даёт 10% скидку
Что изменилось за два года
• Flexbox Froggy
• Grid Garden
• Как работает на низком уровне Node.js и Angular?
Новости недели
• Service Workers: Going beyond the page
• Release Notes for Safari Technology Preview 46
• STP 46 freezes Safari’s user agent
• I want things to be different…
• Chrome will start blocking ads on February 15
Фронтенд в 2017 году
• Frontend in 2017: The important parts
• Мой ванильный CSS
• Missed naming opportunities
Новые форматы новостей
• Веб-стандарты на Ютубе
• Best Dynamic USB Microphone
• Good Starter Microphone
Кому молодых фронтендеров?
Ведущие: Андрей Мелихов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:03:21 События
00:15:47 Бета Chrome 64 и V8
00:20:30 Поддержка опенсорса
00:50:00 Что не так с CSS
01:05:50 Что не так с классами в JS
01:22:22 HTML 5.2 и WHATWG
События
• Pitercss_meetup №17 в Питере 20 декабря
• WSD в Москве 3 февраля
• HolyJS Piter в Питере 19–20 мая
• YGLF Kyiv в Киеве 24–25 мая
• Front-Trends в Варшаве 24–25 мая
• Frontend Conf в Москве 28–29 мая
• CSSconf в Берлине 1 июня
• JSConf в Берлине 2–3 июня
• Pitercss_conf в Питере 8–9 июня
• CSS Day в Амстердаме 14–15 июня
Бета Chrome 64 и V8
• Chrome 64 Beta
• V8 JavaScript code coverage
Поддержка опенсорса
• Sindre Sorhus is creating open source software
• Gitcoin
Что не так с CSS
• CSS Reset: Bert Bos & Håkon Wium Lie
Что не так с классами в JS
• I don’t like this pattern
• Ideally the latter I’d say
HTML 5.2 и WHATWG
• Рекомендация HTML 5.2
• Thanks Steve for everything
• Новая политика WHATWG: шаг к единому стандарту HTML?
• Please ignore the WHATWG HTML spec
• Add link rel="modulepreload"
Ведущие: Виталий Фридман, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:04:19 События
00:23:16 Новинки браузеров
00:53:28 Webpack или Parcel
01:16:46 GIF устарел
01:26:30 Smashing Magazine
События
• HolyJS в Москве 10–11 декабря
• Pitercss_meetup №17 в Питере 20 декабря
• MinskJS Meetup 3 в Минске 25 января
• WSD в Москве 3 февраля
• Rolling Scopes в Минске 10–11 февраля
• Smashing Conf
Новинки браузеров
• Safari TP 45
• Chrome 63
• Intent to Ship: image decoding attribute
• Chrome 65 adding Web Animations API implementation
• Intent to Ship: Web Authentication
Webpack или Parcel
• Webpack 4.0.0-alpha.0
• Parcel
GIF устарел
• Эволюция img Gif без формата GIF
• Debugging Grid Layouts With Firefox Grid Inspector
Smashing Magazine
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:10:04 Edge и Chrome
00:31:15 Firefox и веб-компоненты
00:44:15 CSS-волшебники
01:01:12 Подкаст, форматы, поддержка
События
• KharkivFrontend #_0 в Харькове 9 декабря
• RND.JS #4 в Ростове-на-Дону 9 декабря
• HolyJS в Москве 10–11 декабря
• WSD в Москве 3 февраля
• Frontend Conf в Москве 6–7 июня
• ScotlandCSS в Эдинбурге 18 июля
• ScotlandJS в Эдинбурге 18–20 июля
• pitercss_conf в Петербурге 8-9 июня
Edge и Chrome
• Edge now available for iOS and Android
• DevTools Chrome 63
• DevTools Chrome 64
Firefox и веб-компоненты
• Intent to implement: Shadow DOM
• Intent to implement: Custom Elements
• Светлое будущее Custom Elements
• I is="the walrus"
• GitHub vulnerability announcements
CSS-волшебники
• Flexible Overflow
• A few syntaxes for element queries in CSS
• Generating Wireframe Boxes with CSS and HTML5
Подкаст, форматы, поддержка
Ведущие: Андрей Романов, Алексей Симоненко, Вадим Макеев
Темы
00:00:00 Интро
00:01:06 События
00:14:27 Firefox 58 и совместимость браузеров
00:30:16 JS-модули, React + BEM
01:07:31 Карьера, For Web
01:28:13 Паблики и Smashing Magazine
События
• Ответы на вопросы про YGLF Kyiv
• JSConf Armenia в Ереване 9 декабря
• Приём докладов на CSSconf
• Приём докладов на JSConf
Firefox 58 и совместимость браузеров
• New in Firefox 58: Developer Edition
• Wantr
JS-модули, React + BEM
• Dynamic import()
• Что за lit-html?
• Bemto-components
• jQuery умер, да здравствует React
• Как я перестал верить технологиям
Карьера, For Web
• Andrey Romanov
• Паблик For Web
• Телеграм For Web
• Сайт For Web
Паблики и Smashing Magazine
Ведущие: Саша Годун, Вадим Макеев
Темы
00:00:00 Интро
00:02:17 События
00:04:19 Firefox жив!
00:12:32 Парное программирование
00:24:36 Дорогой JS
00:31:31 Доступность
00:41:21 Книги и термины
00:52:23 Школы при компаниях
01:00:54 Юниоры
События
• Видео с WSD в Киеве
• WSD в Москве 3 февраля
• Pitercss_meetup №16 в Питере 28 ноября
• React Amsterdam в Амстердаме 13 апреля
Firefox жив!
• Firefox 57
• Firefox Quantum Devtools
• Firefox Quantum is live! Have some pixels!
Парное программирование
• Introducing Visual Studio Live Share
• Code together in real time with Teletype for Atom
• Highcharts
Дорогой JS
• The Cost Of JavaScript
• Real-world Web Performance Budgets
Доступность
• В интернете нет ни ступенек, ни пандусов
• Static AST checker for a11y rules on JSX elements
• Индуктивная доступность, Антон Есауленко
• Наадя
• Arzamas
• Веблайнд
Книги и термины
• Секреты CSS, Лия Веру
• A Book Apart
• A Book Apart в МИФе
• CSS: The Definitive Guide
• Declining Complexity in CSS, Эрик Мейер
• Будет издана книга «CSS. Полное руководство»
• Словари по фронтенду
Школы при компаниях
Юниоры
Ведущие: Михаил Колосков, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:47 События
00:14:18 Node.js
00:22:31 Типографика и CSS
00:29:34 Интервенции Chrome
00:44:39 Дизайн в Деньгах
События
• Видео с FrontTalks в Екатеринбурге 16–17 сентября
• Видео с WSD в Минске 21 октября
• Ladies Code в Москве 25 ноября
• WSD в Москве 3 февраля
• Krasnodar Frontend #1 в Краснодаре 19 ноября
• Ember.js Meetup #2 в Петербурге 24 ноября
• KharkivFrontend в Харькове 9 декабря
• JS Fest в Киеве 30–31 марта
Node.js
• Node.js 8 Moves into LTS
• Жду npm install уже минут 10
Типографика и CSS
• Intent to Ship text-decoration-skip-ink
• CSS Text Decoration L3
• CSS Pseudo-Elements L4
Интервенции Chrome
• My web app died from performance bankruptcy
• Chrome Platform Status: Interventions
Дизайн в Деньгах
Ведущие: Юрий Артюх, Юрий Ткаченко, Вадим Макеев
Темы
00:00:00 Интро
00:03:23 События
00:25:19 Проблемная ReactiveConf
00:44:52 Графика и цвет
00:56:43 Фокус и курсоры
01:09:59 React и Kotlin
01:24:54 Украинский фронтенд
События
• WSD в Киеве 4 ноября
• Запись трансляции
• YGLF Kyiv в Киеве 24–25 мая 2018
• Frontend fwdays в Киеве 26 ноября
Проблемная ReactiveConf
• ReactiveConf в Братиславе 25–27 октября
• Why I will not be speaking at ReactiveConf
• Why I cancelled my ReactiveConf talk
Графика и цвет
• SVGO 1.0
• SVG: context-properties
• Gifski
• GIF to video converter
Фокус и курсоры
• Focusingly
• A Better Focus
• Change the pointer cursor
• Colour management and gamut
React и Kotlin
• Create React Kotlin App
• The melting pot of JavaScript
• Removing React.js resulted in a 50% perf improvement
• Netflix functions without client-side React
Украинский фронтенд
Ведущие: Настя Суховерхова, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:57 События
00:09:27 Доступность
00:55:46 Дизайн
События
• WSD в Киеве 4 ноября
• YGLF в Киеве 24–25 мая
• YGLF в Тель-Авиве 30–31 октября
• Видео с Chrome Dev Summit
Доступность
• Веблайнд
• Код на Гитхабе
• Collapsible Sections
• WAI-ARIA Authoring Practices 1.1
• A11ycasts Роба Додсона
Дизайн
• Мои правила хорошей дизайн-системы
• Прототипирование на продакшен-технологиях
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:11 События
00:05:02 Браузеры и MDN
00:35:15 Ошибки верстальщиков
00:46:27 Дизайнеры учатся кодить
00:56:36 Харассмент
События
• WSD в Минске прошёл 21 октября
• Exantech Code Jam в Москве 28 октября
• WSD в Киеве 4 ноября
• JavaScript Party в Новосибирске 25 октября
• Rolling Scopes в Минске 10–11 февраля
• Front‑Trends в Варшаве 24–25 мая
Браузеры и MDN
• EdgeHTML 16
• Chrome 62
• Source Sans Pro (variable)
• Support for variable fonts has reached critical mass
• Safari TP 42
• Resource Hints
• PWAs with Firefox Nightly
• Mozilla brings Microsoft, Google, the W3C, Samsung to MDN
• W3Fools
• WebPlatform
Ошибки верстальщиков
• Ошибки и спорные вопросы вёрстки: разметка
• Ошибки и спорные вопросы вёрстки: стилизация
Дизайнеры учатся кодить
• Почему я решил изучать код
• Хороший старт и первые проблемы
• Технолог — тоже дизайнер
Харассмент
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:10 События
00:08:28 Затишье браузеров
00:12:31 Цифры Гитхаба
00:33:04 Загрузка картинок
00:39:24 (Не)нужные книги
00:48:54 Война за CSS
01:02:24 Редизайн Slack
01:19:11 Спецвыпуски
События
• WSD в Минске 21 октября
• WSD в Киеве 4 ноября
• IT Global Meetup #11 в Питере 28 октября
• OdessaFrontend #2 в Одессе 31 октября
• CSSconf в Берлине 1 июня
• JSConf в Берлине 2—3 июня
• CSSConf AU в Мельбурне 20 марта
• I’m in IoT на Front-Trends
Затишье браузеров
• Link rel="preload" will be temporarily unshipped in Firefox 57
• Репозиторий WSD
Цифры Гитхаба
• GitHub Universe
• The State of the Octoverse 2017
Загрузка картинок
• Улучшаем опыт взаимодействия с формами
• Creating a Camera App
• Uploading an Image
(Не)нужные книги
• CSS: The Definitive Guide, 4th Edition Goes to Print
Война за CSS
• Let There Be Peace on CSS
• Обсуждение в 70 выпуске
Редизайн Slack
Спецвыпуски
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:29 События
00:04:58 Браузеры и разнообразие
00:24:06 Сетки и смерть сайтов
00:36:17 Плохая кнопка
00:43:09 Зачем доступность
01:02:38 Знакомьтесь, JS
События
• WSD в Минске 21 октября
• WSD в Киеве 4 ноября
• Fronteers в Амстердаме 5—6 октября
• Интерфейс для календаря
Браузеры и разнообразие
• Microsoft Edge for iOS and Android
• Firefox 56
• Intent to Implement: image async attribute
• Help Your Users Save-Data
Сетки и смерть сайтов
• Как создать адаптивную сетку
• Frontender Magazine
• У нас небольшая катастрофа
Плохая кнопка
• Making a Pure CSS Play/Pause Button
Зачем доступность
• Переключатель темы
• Tabbed Interfaces
• How to build a toggle button
• ARIA Authoring Practices 1.1
• The future of accessibility for custom elements
Знакомьтесь, JS
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:55 Лицензии и DRM
00:25:35 Чудеса SVG и border-image
00:42:34 Оптимизация графики
00:55:31 Шорты и JS-типизация
01:03:39 Доступные диалоги
События
• WSD в Минске 21 октября
• WSD в Киеве 4 ноября
• Fronteers в Амстердаме 5—6 октября
• KharkivJS в Харькове 28—29 октября
• LvivCSS во Львове 11 ноября
• FrontFest в Москве 18 ноября
• HolyJS в Москве 10 декабря
Лицензии и DRM
• Relicensing React, Jest, Flow, and Immutable.js
• Relicensing the GraphQL specification
• EME at the W3C
• EME Misdirection
• Considering Open Source Licenses
Чудеса SVG и border-image
• SQIP, SVG-Based Image Placeholder
• Border-image + linear-gradient
• Border-image + Houdini Paint API
• Рамки и фоны, часть 2
Оптимизация графики
• Essential Image Optimization
• HEIC
• HEIV
Шорты и JS-типизация
• Сахарный JS
• Draggable JS
• Covfefescript?
Доступные диалоги
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:08 События
00:11:21 Зачем вообще Edge
00:24:19 Новинки Safari
00:43:09 Бета Chrome 62
00:54:11 Кому нужен CoffeeScript 2
01:06:59 Идеи для DevTools
События
• Pitercss_meetup №14 в Питере 26 сентября
• WSD в Минске 21 октября
• Moscowcss 5 в Москве 31 октября
• OdessaFrontend в Одессе 27 сентября
• Календарь событий по фронтенду
• Список сообществ CityJS
• Front Fest Moscow в Москве 18 ноября
Зачем вообще Edge
Новинки Safari
• New WebKit Features in Safari 11
• Designing Websites for iPhone X
• Min and max now in WebKit
• How to design for that iPhone X knub thing
• Release Notes for Safari Technology Preview 40
• Holy shit it actually works in a stable Safari
Бета Chrome 62
Кому нужен CoffeeScript 2
• CoffeeScript 2
• За что я люблю CoffeeScript (2011)
Идеи для DevTools
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:02:36 Вписаться в iPhone X
00:16:00 Редакторы кода
00:26:10 Инверсная тема в 153 байтах
00:33:15 Жизнь после git --force
00:41:02 История гридов
00:44:06 Вёрстка и программирование
01:01:51 ES-модули в Node и в бою
События
• FrontTalks в Екатеринбурге 16—17 сентября
• CSS-Minsk-JS в Минске 10 сентября
• Fronthub в Ульяновске 11 ноября
Вписаться в iPhone X
• iOS 11 Viewport
• Removing the White Bars in Safari on iPhone X
• Add safe area properties/constants
• Now that the iPhone X has been announced…
Редакторы кода
• Sublime Text 3.0
• Introducing Atom-IDE
Инверсная тема в 153 байтах
Жизнь после git --force
• Git push --force and how to deal with it
• Git Tower
История гридов
Вёрстка и программирование
• Is there any value in people who cannot write JS?
• Математика для программиста, HTML Шорты
ES-модули в Node и в бою
• What’s new in Node.js 8.5?
• Using ES modules natively in Node.js
• Deploying ES2015+ Code in Production Today
Ведущие: Vadim Makeev, Aga Naplocha, Harry Roberts, Eva Lettner, Zach Leatherman, Kitty Giraudel
Темы
00:00:00 Интро
00:00:27 Aga Naplocha
00:13:18 Harry Roberts
00:34:02 Eva Lettner
00:48:20 Zach Leatherman
01:02:14 Kitty Giraudel
Aga Naplocha
• Aga on Twitter
• The Awwwesomes
• CSSclasses
Harry Roberts
• Harry on Twitter
• CSS Wizardry
• Inuitcss
Eva Lettner
• Eva on Twitter
• Eva on CodePen
Zach Leatherman
• Zach on Twitter
• Bram Stein on Twitter
• A Comprehensive Guide to Font Loading Strategies
Kitty Giraudel
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:20 События
00:07:38 Браузеры
00:35:19 Yarn 1.0
00:51:19 Сломать гриды
00:54:51 Ресеты не нужны
События
• CSS-Minsk-JS в Минске 10 сентября
• FrontTalks в Екатеринбурге 16—17 сентября
• PiterJS №17 в Петербурге 21 сентября
• Pitercss_meetup №14 в Петербурге 26 сентября
• Fronteers в Амстердаме 5—6 октября
• Календарь событий по фронтенду
Браузеры
• Release Notes for Safari Technology Preview 39
• New in Chrome 61
• Webcompat: layout is messed up
Yarn 1.0
Сломать гриды
• Что может поломать макет на гридах
Ресеты не нужны
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:09:13 Браузер без головы
00:19:44 Многопоточный JS
00:33:46 Новинки Edge
00:37:57 Оптимизация загрузки
01:04:29 Фавиконки в Шортах
01:09:52 На все руки веб-мастер
События
• Moscow Frontend Conference в Москве 2 сентября
• Pitercss_meetup №14 в Петербурге 26 сентября
• CSS-Minsk-JS в Минске 10 сентября
Браузер без головы
• Headless mode on MDN
• Screenshots of specific HTML nodes in Chrome
• Capture DOM element screenshot using Chrome headless
Многопоточный JS
• WebKit: Concurrent JavaScript: It can work!
• What’s New In Chrome DevTools 62
Новинки Edge
• New web platform features in Edge
Оптимизация загрузки
• Ускоряем загрузку сайтов в эпоху смартфонов
• Managing CSS & JS in an HTTP/2 World
• Why Latency Matters: Foundations of Web Performance
• Manual priority control of resource fetching
Фавиконки в Шортах
• Подключение фавиконок, HTML Шорты
На все руки веб-мастер
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:11 События
00:06:58 Safari
00:11:51 Stylo
00:21:39 PWA и Android
00:29:29 Polymer 3.0
00:50:50 Читайте Шорты
00:54:45 React или CSS
00:59:12 Шрифты
01:06:32 Новичкам
01:16:58 RadioJS
События
• LvivJS во Львове 26 августа
• DevFest Siberia в Новосибирске 23—24 сентября
• Форма для докладов на pitercss_meetup
• Почта для докладов [email protected]
• Moscow_css в Москве 7 сентября
• Почта для докладов [email protected]
• FrontTalks в Екатеринбурге 16—17 сентября
• WSD в Минске 21 октября
• Почта для докладов [email protected]
Safari
• Release Notes for Safari TP 38
Stylo
• Inside a super fast CSS engine: Quantum CSS
PWA и Android
• Android Oreo takes a bite out of PWA
Polymer 3.0
• Polymer @ YouTube
• Polymer 3.0 preview: npm and ES6 Modules
• Polymer ditches HTML Imports in favor of ES6 modules
• HTML Modules
Читайте Шорты
• Хороший плохой манкипатчинг
• Шорты на Хабре
React или CSS
• Div и React или input type="checkbox" и CSS?
Шрифты
• Mix font-display values for same family
• Glyphhanger
Новичкам
• Путь верстальщика 2017
• Статья Максима Усачёва 2012 года
RadioJS
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:17 События
00:09:40 Chrome
00:21:06 Аудит 2.0
00:29:47 Доступность
00:37:06 SVG
00:43:43 Флексы для дизайнера
00:47:15 Видео по фронтенду
00:58:12 Кроссбраузерность
События
• Frontend Party в Нижнем Новгороде 29 августа
• PiterJS №16 пройдёт в Петербурге 29 августа
• Календарь событий по фронтенду
• Обидно, что наши звёзды не участвуют
Chrome
• Chrome 61 Beta
• GoogleChrome/puppeteer
Аудит 2.0
• A11ycasts: Audits 2.0
• Contrast ratio in devtools
• Особенности интерфейсов при работе со скринридерами
• Accessibility Testing with pa11y
Доступность
• Как сделать сайты доступнее для незрячих
• Базовая вёрстка с доступностью
SVG
• Размеры в SVG, Юля Бухвалова
Флексы для дизайнера
• Руководство по флексам и гридам для дизайнеров
Видео по фронтенду
• HTML Шорты: Адаптивная вёрстка
• Новый канал getInstance
• Пятиминутка React с Екатериной Назаровой
Кроссбраузерность
• Allo.google.com site is not usable
• It’s all about UA sniffing
• Only Chrome supports WebRTC & Fetch
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:48 События
00:08:39 Firefox
00:15:47 Samsung
00:24:39 Safari
00:33:28 Алгоритмы и паттерны
00:38:25 Прозрачный JPG
00:43:13 Телеграм
00:52:22 Приоритеты загрузки
01:02:53 Фокусы
01:11:17 Модули в Node.js
События
• Трансляция с Яндекс Субботника в Питере
• LvivCSS во Львове 11 ноября
• Календарь событий по фронтенду
Firefox
• Новинки Firefox 55 для разработчиков
• Intersection Observer comes to Firefox
Samsung
• Big news for our new Samsung Internet beta v6.2!
Safari
• Safari TP Release 37
• Well this makes me happy
• CSS font-display in development
• Grid Layout in Chromium Dev Tools
• CSS Grid Highlighter
Алгоритмы и паттерны
• Нужно ли фронтендеру знать алгоритмы и паттерны?
Прозрачный JPG
• JPNG.svg
Телеграм
• Виталий Харисов в Телеграме
• Bootstrap 4 Beta
Приоритеты загрузки
Фокусы
• Removing that ugly :focus ring
• Managing Focus
Модули в Node.js
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:02:35 Сервис-воркеры
00:13:09 Загрузка шрифтов
00:27:32 GridBugs
00:37:13 Бумажные книги
00:43:25 Picture на практике
00:51:12 Тяжёлые пакеты
01:01:11 WTF JS?
События
• Яндекс Субботник в Питере 12 августа
• LvivJS во Львове 26 августа
• PiterJS в Питере в конце августа
• Pitercss_meetup в Питере в конце августа
• Moscow Frontend Conference в Москве 2 сентября
Сервис-воркеры
• Service Workers: In Development
• Нашёл Джейк Арчибальд
• Подтвердил Джонатан Дэвис
• Apple’s refusal to support PWA
Загрузка шрифтов
• Crafting Webfont Fallbacks
• Посторонние шрифты
• Font Aliasing, or How to Rename a Font in CSS
GridBugs
• Gridbugs
• Adding row-gap and column-gap to flexbox
Бумажные книги
• jQuery в действии. 3-е издание
• jQuery in Action, third edition
Picture на практике
• Responsive Images: Use Cases and Code Snippets
Тяжёлые пакеты
• What is the cost of my npm package ?
• Import Cost
• Why Node module file sizes matters?
WTF JS?
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:03:09 Новости!
00:05:01 Chrome 60
00:11:03 Stylo
00:14:52 Flash 1996—2020
00:22:43 Статистика браузеров
00:28:47 Сброс стилей
00:38:55 Большой текст
00:47:47 Доступные подсказки
00:52:45 Порядок элементов
00:59:24 Новинки ES
01:09:08 Голос SPB Frontend
01:10:42 Должен ли?
События
• RamblerFront& meetup №2 в Москве 3 августа
• Яндекс Субботник по фронтенду в Петербурге 12 августа
• Pitercss_meetup
• CSS Minsk JS в Минске 10 сентября
• Школа Node.js в Петербурге 18 сентября—7 ноября
Новости!
Chrome 60
• Chrome 60
• Found bugs we didn’t like, pushed back to M61
Stylo
• Stylo is ready for community testing on Nightly!
Flash 1996—2020
• Flash & The Future of Interactive Content
Статистика браузеров
• Браузеры по данным Яндекс Метрики
Сброс стилей
• Нормальный сброс
• PostCSS Initial
Большой текст
Доступные подсказки
Порядок элементов
• Does reordering content affect accessibility?
Новинки ES
• July 2017 Proposals
• Binary AST
• Optional catch binding
• BigInt
• Numeric Separators
• ES proposal: class fields
• Продвинутый JavaScript
Голос SPB Frontend
Должен ли?
• Артемий Лебедев про нейросети
• Чётко и резко
• EdgeHTML is meant to be fully compatible with the WebKit
Ведущие: Павел Ловцевич, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:11 События
00:10:23 Новинки DevTools
00:22:10 Storage API в Firefox
00:28:13 DRM и W3C
00:47:03 Чистка CSS
00:56:11 Вброс и Шорты
01:01:59 Гироскоп и драг-н-дроп
01:09:17 Состояние JS
01:10:23 Xwebs Megabrowser
События
• NodeSchool SPb в Петербурге 29 июля
• KharkivJS в Харькове 28–29 октября
• CSS-Minsk-JS в Минске 10 сентября
Новинки DevTools
Storage API в Firefox
• Preview Storage API in Firefox Nightly
DRM и W3C
• Как в HTML DRM внедрили: измена или эволюция?
• Encrypted Media Extensions
Чистка CSS
• UnCSS
• PurifyCSS
• Где используются прототипы, наследование в JS приложениях?
Вброс и Шорты
• Где используются прототипы, наследование в JS-приложениях?
• Прятки на CSS: display: none, visibility: hidden?
Гироскоп и драг-н-дроп
• The Gyroscope part of The Standard
• Drag and Drop part of The Standard
• Улучшаем опыт взаимодействия с формами
Состояние JS
Xwebs Megabrowser
• Teen’s Web Browser Wows Top Geeks
• Addy Osmani: at 16, wrote a web browser in C++
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:06 Вертикальный ритм
00:07:22 Sass разрешил
00:16:03 Переменные в препроцессорах
00:30:16 Susy жива
00:32:56 Экономия на классах
00:41:06 Чёрная магия CSS
00:46:02 ES 2017
00:50:30 Полезный npx
События
• UralJS №4 в Екатеринбурге 20 июля
• WebDev Meetup №3 в Новосибирске 19 августа
Вертикальный ритм
• CSS line-height-step introduced to control vertical rhythm
Sass разрешил
Переменные в препроцессорах
• Переменные в препроцессорах Less и Sass
Susy жива
• Understanding Spread in Susy3
Экономия на классах
• Reducing CSS bundle size 70%
• Минимизация классов в HTML
Чёрная магия CSS
ES 2017
• ES8 вышел и вот его основные новые возможности
Полезный npx
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:05:33 Так пора гриды?
00:18:45 Edge и IE
00:23:52 Сетки и стримеры
00:30:39 Будущее CSS
00:39:12 CSS is Awesome
00:46:52 Примеры ARIA
00:49:38 Фокус и аутлайн
00:58:12 JS-импорты
01:04:10 Подкасты
События
• LvivJS во Львове 26 августа
• Moscow Frontend Conference в Москве 2 сентября
• CSS-Minsk-JS в Минске 10 сентября
• FrontTalks в Екатеринбурге 16—17 сентября
• Frontend Dev Conf в Минске 30 сентября
• Fronteers Conference в Амстердаме 5—6 октября
• FrontFest в Москве 18 ноября
• HolyJS в Москве 10—11 декабря
Так пора гриды?
• Правда ли уже пора использовать CSS Grid Layout?
Edge и IE
• New Microsoft Edge features
• An update on disabling VBScript in IE 11
Сетки и стримеры
• Building a Grid System with CSS Custom Properties
• Lessons from my first year of live coding on Twitch
Будущее CSS
• What’s next for CSS?
• W3C: CSS current work
CSS is Awesome
Примеры ARIA
• WAI-ARIA Authoring Practices
Фокус и аутлайн
JS-импорты
• Intent to Implement: JavaScript module import
Подкасты
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События
00:03:25 Разнообразие браузеров
00:12:57 HTML для людей
00:23:23 PE и GD в Шортах
00:25:40 Гриды с фолбэком
00:33:06 Фокус с клавиатуры
00:38:54 Трюки со шрифтами
00:47:31 Рефакторинг и ответственность
00:51:39 Uber в браузере
00:57:12 Фича из CS в ES
События
• Ru Frontend Events
• Typetersburg 5—6 августа
• Pitercss_meetup в августе-сентябре
• WSD осенью-зимой
Разнообразие браузеров
• Release Notes for Safari Technology Preview 34
• Because Browser Diversity Is Good For The Web
HTML для людей
• The Developer’s Edition of HTML makes a comeback
• HTML Living Standard (WHATWG)
• HTML 5.2 Draft (W3C)
PE и GD в Шортах
Гриды с фолбэком
• От бутстрапа — к CSS-гридам
• CSS Grid in production on the Mozilla website!
Фокус с клавиатуры
Трюки со шрифтами
• Font Aliasing, or How to Rename a Font in CSS
• Unquoted font family names in CSS
Рефакторинг и ответственность
• Front End Center: Single Responsibility Components
• React: Why Accessibility?
• Create-react-app now warns if JS bundles exceed 500KB
Uber в браузере
• Engineering a High-Performance Web App
• Каждое обновление Убер 270 мегабайт
Фича из CS в ES
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:35 События
00:07:52 Firefox
00:17:06 Гриды в Edge
00:19:30 Зачем флексы
00:21:58 JS-модули в HTML
00:25:37 Webpack 3
00:34:40 CSS-фрагменты
События
• Как прошёл Питер-ЦСС
• PiterCSS Conference Review
• OdessaJS в Одессе 1—2 июля
• LvivJS во Львове 26 августа
• FrontTalks в Екатеринбурге 16—17 сентября
• JSConf Budapest 2017 26—27 октября
Firefox
• Новинки Firefox 54 для разработчиков
• Инспектор раскладок в Firefox Nightly
Гриды в Edge
• Новые гриды в Edge Insider Preview
Зачем флексы
• Кому нужны флексы, HTML Шорты
JS-модули в HTML
• Intent to ship script type=module in Blink
Webpack 3
CSS-фрагменты
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:05:23 DirecTV
00:11:16 Safari
00:23:35 Chrome
00:29:48 Edge
00:35:14 Гриды
00:39:32 Шорты
00:43:55 Стример Юра
00:46:45 Stylelint
01:02:03 Node.js
События
• pitercss_conf 16 июня
• NodeSchool в Новосибирске 17 июня
• DevConf 17 июня
• OdessaJS 1—2 июля
DirecTV
• DirecTV Now will only support Chrome on desktop starting in July
Safari
• What’s new in Safari 11
• Auto-Play Policy Changes for macOS
• Assembling WebAssembly
• JSC Loves ES6
Chrome
• What’s New In Chrome 59 DevTools
Edge
• Edge web platform features
• Grids: still behind a flag
Гриды
• Как работает функция minmax в гридах
Шорты
• HTML Шорты: зачем нужны заголовки
Стример Юра
• Logo animation
• Responsive landing page
Stylelint
• Autofixing in stylelint
• Prettier 1.4.0
Node.js
Ведущие: Валерий Сорокобатько, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:50 События
00:09:44 Safari TP
00:16:42 Нативный календарик
00:20:53 Разработка на телефоне
00:26:39 Гриды на практике
00:28:15 Кастомные свойства
00:35:14 Магия лейблов
00:37:23 Флексы вглубь
00:42:32 Node.js и npm
00:51:00 CSS-in-JS
События
• HolyJS 2—3 июня
• UralJS: Code Retreat 10 июня
• JS Party в Новосибирске 7 июня
• RND.JS №3 в Ростове-на-Дону 24 июня
• OrelJS №1 в Орле 24 июня
Safari TP
• Release Notes for Safari Technology Preview 31
Нативный календарик
• Date picker in Firefox Nightly
Разработка на телефоне
• Writing software using a phone!
Гриды на практике
Кастомные свойства
Магия лейблов
Флексы вглубь
• 11 вещей, которые я узнал, читая спецификацию flexbox
Node.js и npm
• Обзор изменений в новом мажорном релизе Node 8
• npm@5 теперь npm@latest
CSS-in-JS
• The new CSS workflow in Webpack
• Письмо любви CSS
• CSS в JS: будущее компонентных стилей
• Rockey. Motivation and Requirements
• I swore never to use CSS in JS, here are 6 reasons why I was wrong
• A Unified Styling Language
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:07:57 Маркетинг Firefox
00:16:44 Npm 5 догоняет
00:29:00 Доступность
00:36:12 Почему шорты и шоу
00:41:10 CSS-in-JS
00:49:51 Webpack и SPA
00:58:02 Гриды
01:01:13 Новичкам
События
• Front-Trends
• Drone hijacked on stage
• HolyJS 2—3 июня
• Frontend Conf 5—6 июня
• Pitercss_conf 16 июня
• Fronteers 5—6 октября
• DevConf 17 июня
• OdessaJS 1—2 июля
• FrontTalks in English?
Маркетинг Firefox
Npm 5 догоняет
Доступность
• Just landed behind a flag in Canary: inert
• Why headings and landmarks are so important
Почему шорты и шоу
• Зачем нужен БЭМ вне Яндекса?
CSS-in-JS
• A Unified Styling Language
• Let There Be Peace On CSS
• London CSS Meetup, January 2017
• Андрей Оконечников на pitercss_conf
• Андрей Оконечников в 42 выпуске
Webpack и SPA
• Введение в философию Webpack
• Custom Elements v1: Reusable Web Components
• Shadow DOM v1: Self-Contained Web Components
Гриды
• Learn CSS Grid
• Accurately checking for CSS Grid support in Edge
Новичкам
• Статьи Артёма Горбунова про типографику и вёрстку
• Открыть папку или файл из терминала
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:16 События
00:03:45 Samsung
00:12:48 Safari
00:20:07 Google I/O
00:21:49 Git в Atom
00:32:31 GitHub Desktop
00:40:32 Box Alignment
00:46:58 Lazy Image
00:53:07 Лия и Mavo
00:59:33 ППК и формы
01:07:44 Фронтенд заговорил
01:10:09 Perf.HTML
01:12:11 ES-модули
События
• Видео с pitercss_meetup №13
• Pitercss_conf 16 июня
Samsung
• Announcing Samsung Internet v5.4 stable!
• Hacker News readers as Progressive Web Apps
Safari
• Safari Technology Preview 30
• Responsive Design for Motion
Google I/O
• Google I/O 2017 All Sessions
Git в Atom
• Git and GitHub Integration comes to Atom
GitHub Desktop
• How Four Native Developers Wrote An Electron App
Box Alignment
• Box alignment: justify-content: space-evenly
• Свойства для выравнивания всего и их новые тайны
• Наклейки для бейджей WSD
Lazy Image
Лия и Mavo
• Introducing Mavo: Create Web Apps Entirely By Writing HTML!
ППК и формы
• Native form validation — part 3
Фронтенд заговорил
• Как правильно вставлять SVG?
• Frontend Weekend
Perf.HTML
• Understanding the network bottleneck
• Identifying the JavaScript slowdown
• Profiling Paint Perf
ES-модули
• Module specifiers: what’s new with ES modules?
• Native ES Modules — Ready for Prime Time?
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:28 События
00:02:28 Edge
00:08:22 Opera
00:10:36 Electrino
00:16:10 Автопрефиксер
00:26:18 Меню-кнопка
00:33:53 Ирония
00:38:05 Валидация форм
00:48:51 Логичные размерности
События
• Pitercss_meetup №13 в Питере 17 мая
• Moscowcss №3 в Москве 18 мая
• MinskJS в Минске 18 мая
• ITsubbotnik EPAM в Москве 27 мая
• UralCSS №1 в Екатеринбурге 9 июня
• Pitercss_conf 16 июня
Edge
• Edge: What’s new and what’s next
• What’s new in EdgeHTML 15
• PWA discoverability on Windows: Bing, Store
• PWA manifest to create the Store listing
• PWA on Windows 10 as WebAPK on Android
Opera
• What’s new in Chromium 58 and Opera 45
Electrino
• Put your Electron app on a diet with Electrino
Автопрефиксер
• Autoprefixer 7.0 and Browserslist 2.0
Меню-кнопка
• Menus & Menu Buttons
• Inclusive Menu Button
• React Menu Button
Ирония
• HTML сломан!
• Прогрессивное улучшение меня расстраивает
Валидация форм
• Native form validation — part 1
• Native form validation — part 2
Логичные размерности
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:29 События
00:04:17 Бета Chrome 59
00:11:12 Safari TP 29
00:18:18 Samsung на десктопе
00:26:28 WebP торт
00:33:01 HTML Шорты
00:35:26 Normalize.css
00:39:59 CSS 5 уровня
00:44:15 CSS-in-JS
01:15:16 ES-модули
События
• Видео с UralJS №3 в Екатеринбурге
• Видео с PiterJS №14 в Питере
• Pitercss_meetup №13 в Питере 17 мая
• Pitercss_conf 16 июня
• FrontDays в Тольятти 20 мая
• Front-Trends в Варшаве 24—26 мая
• HolyJS в Питере 2—3 июня
• Frontend Conf в Сколково, 5—6 июня
Бета Chrome 59
• Chrome 59 Beta
• Getting Started with Headless Chrome
Safari TP 29
• Release Notes for Safari Technology Preview 29
• The :focus-within pseudo class
Samsung на десктопе
• Samsung DeX brings a new Dimension to the Mobile Web
WebP торт
• Wait, WebP is actually worth it
HTML Шорты
• Зачем задавать картинку через background-image
Normalize.css
• Normalize.css v6/v7 diff
• Postcss-normalize
CSS 5 уровня
• Первый черновик CSS 5-го уровня
CSS-in-JS
• Stop using CSS in JavaScript for web development
• Ran it on Safari it’s like 380x times worse
• Is CSS-in-JS really bad for UX?
• A Unified Styling Language
• With real empathy for CSS devs
ES-модули
• ES6 Modules in Chrome Canary (M60+)
• ES Modules in Browsers
Ведущие: Антон Шеин, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:20 События
00:04:39 Из React в Sketch
00:13:44 HTML в WebGL
00:23:17 Игра на CSS
00:31:30 Гриды
00:43:30 HTML Шорты
00:45:02 Дизайнеры и код в Яндексе
События
• Design Prosmotr
• pitercss_conf в Питере 16 июня
• Ha.js в Хабаровске 13 мая
• Moscowcss №3 18 мая
• MinskJS №2 18 мая
Из React в Sketch
• Painting with Code: React Sketch.app
• Sketch 43 with an open file format!
• Protein
HTML в WebGL
• DOM2Texture: Abusing Arcane APIs
• F8 2017 Videos
Игра на CSS
• Adventure Time: Rescue of Flame Princess
• Пламенная Принцесса
Гриды
• CSS Grid Cheat Sheet
• Set of guides to grid layout on MDN
• Responsive Periodic Table with CSS Grids
• Мой ванильный CSS
HTML Шорты
• Можно ли оборачивать блок в ссылку?
Дизайнеры и код в Яндексе
Ведущие: Виталий Слободин, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:10 События
00:05:07 Firefox 53
00:09:59 Safari TP
00:11:58 Chrome 58
00:13:12 Асинхронные итераторы
00:21:28 PhantomJS всё
00:50:21 Спор о веб-компонентах
01:07:50 Магические зависимости
События
• KharkivCSS 22 апреля
• Видео со SPA Meetup №3
• Видео с MinskCSS №2
• Видео с Moscowcss №2
• Pitercss_meetup №12 25 апреля
• PiterJS №14 27 апреля
• Moscowcss №3 18 мая
• MinskJS №2 18 мая
• Антон Шеин на pitercss_conf
Firefox 53
• Firefox 53 для разработчиков
Safari TP
• Safari Technology Preview 28
Chrome 58
Асинхронные итераторы
• Async iterators and generators
PhantomJS всё
• PhantomJS: Stepping down as maintainer
• Chrome Status: Headless mode
Спор о веб-компонентах
• Ремы, емы и почему отказ от них — не проблема
• Невыполненные обещания веб-компонентов
• По поводу невыполненных обещаний веб-компонентов
• Веб компоненты: светлое настоящее
Магические зависимости
Ведущие: Вадим Макишвили, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:04:57 События
00:09:09 Edge 15
00:28:00 Доступный туду-лист
00:53:08 Доклады, книги, прочее
События
• Первые докладчики pitercss_conf
• KharkivCSS в Харькове 22 апреля
• Pitercss_meetup №12 в Питере 25 апреля
• Текстовая трансляция с React London
Edge 15
• What’s new in Microsoft Edge
• Не гзипом единым
• Трекер Edge
Доступный туду-лист
• Inclusive Components: Todo List
• axe-core
Доклады, книги, прочее
• 36
• 5 минут
• Распечатай Яндекс.Карты
• Большая книга манипуляций
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:25 События
00:04:06 Safari TP
00:08:42 Гриды на огороде
00:17:44 Ремы и емы не нужны?
00:32:24 Новый Твиттер
00:38:37 Современный JS
00:48:06 Полезный код
00:54:11 AMP ломает новости
События
• Билеты на pitercss_conf
• Видео с moscowcss №2 6 апреля
• KharkivCSS №2 в Харькове 22 апреля
• Design Prosmotr в Москве 29—30 апреля
• Front Trends в Варшаве 24—26 мая
• Fronteers Conference 2017 в Амстердаме 5—6 октября
Safari TP
• Release Notes for Safari Technology Preview 27
• Not sure what’s more thrilling…
Гриды на огороде
• Edge Grid Update
• Grid Garden
• Flexbox Froggy
Ремы и емы не нужны?
• Rems and ems, and why you probably don’t need them
Новый Твиттер
Современный JS
• Современный JavaScript для древних веб-разработчиков
Полезный код
AMP ломает новости
Ведущие: Olga Alessandrini, Vadim Machiavelli, Alessio Simonetti
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:03:22 Бета Chrome 58
00:13:24 Safari TP
00:18:58 Кастомные свойства в Edge
00:23:10 Переключатель на кнопке
00:30:38 Гриды на практике
00:40:36 Быстрое меню
00:43:09 Редактор в браузере
00:56:31 Ереси БЭМа
00:59:37 Вёрстка для школоты
События
• Видео с pitercss №11
• 25 докладов с HolyJS 2016
• Moscowcss №2 в Москве 6 апреля
• SPA Meetup №3 в Москве 8 апреля
• Pitercss_conf в Питере 16 июня
Бета Chrome 58
• Chrome 58 Beta
• ControlsList API
• Intent to Implement: CSS conic-gradient()
• CSS conic-gradient() polyfill
Safari TP
• Release Notes for Safari Technology Preview 26
• WebKit Feature Status: Service Workers
Кастомные свойства в Edge
• CSS Custom Properties in Microsoft Edge
Переключатель на кнопке
• Inclusive Components: Toggle Buttons
• Пепелсбей.net: Модный переключатель
Гриды на практике
• Mozilla: CSS Grid
• CSS-гриды пришли насовсем
• CSS Subgrids
• Case Study: My First Practical CSS Grid Layout
• Practical CSS Grid: Adding Grid to an Existing Design
Быстрое меню
• Building performant expand & collapse animations
Редактор в браузере
• What is CodePen Projects?
• Your CPU is busy rendering a blinking cursor
Ереси БЭМа
• Writing modular CSS (Part 1)
Вёрстка для школоты
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:02:17 Фоновые вкладки
00:03:58 CSSO
00:07:40 CSS Peeper
00:11:30 Курс по SVG
00:15:39 Участие в стандартах
00:24:25 Доступность или жизнь
00:31:22 Линтинг HTML
00:34:03 Сайдбар за 5 строк
00:35:41 Загрузка JS
00:41:41 jQuery не нужен!
00:51:04 Пуш-уведомления
00:59:52 Междисциплинарное
01:13:09 Фронтёрки
События
• Node.js SPb №3 31 марта
• Moscowcss №2 6 апреля
• Pitercss №11 21 марта
• FrontDays в Тольятти 20 мая
• OdessaJS в Одессе 1—2 июля
Фоновые вкладки
• Chrome: Reducing power consumption for background tabs
CSSO
• CSSO 3.0.0
• Real Web CSS
• CSS Tree Validator
CSS Peeper
Курс по SVG
• HTML Академия: Оформление SVG-фигур
Участие в стандартах
• Проблема выбора структуры документа
Доступность или жизнь
• Правила использования ARIA в HTML
Линтинг HTML
• Линтинг HTML с помощью CSS
• Создание Alix, Chrome-расширения для линтинга HTML
Сайдбар за 5 строк
• Как сделать сайдбар за 5 строк кода
Загрузка JS
• Асинхронный JavaScript против отложенного
• Off main thread JS loading
jQuery не нужен!
• Need to do Dependency-Free Ajax?
Пуш-уведомления
• Реализуем пуш-уведомления на фронтенде и бэкенде
Междисциплинарное
• Designer vs. Developer
• Настройка сервера и деплой приложения на Node.js
Фронтёрки
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:11 События
00:01:43 Chrome 57
00:06:19 Samsung Internet
00:23:34 Safari TP
00:27:14 Гриды пришли
00:34:24 Выражения от контейнера
00:41:54 Прокрутка в вебе
00:49:42 Оптимизация шрифтов
События
• SPB Frontend в Питере 15 марта
• JS Open Day в Питере, 15 марта
• PiterJS №13 в Питере 23 марта
• HTML-вёрстка для начинающих в Пензе 18 марта
Chrome 57
• Chrome 57: Grid based layouts, Media Session API
• MDN: text-decoration-skip
Samsung Internet
• Samsung Internet Beta now available without sign up
• Google Play: Samsung Internet Beta
Safari TP
• Release Notes for Safari Technology Preview 25
• The future of loading CSS
Гриды пришли
• A New Layout Module for the Web
• Грид + флексбокс: мощнейшее комбо в веб-раскладке
• Grid layout = no media queries and less CSS!
Выражения от контейнера
Прокрутка в вебе
• Scrolling on the web: A primer
Оптимизация шрифтов
• Оптимизация шрифтов
• Homebrew web font tools
• Faster Font Loading with Font Events
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:09:40 Жирненький Firefox 52
00:19:10 История Firefox OS
00:28:00 Руководства по гридам
00:30:42 Кастомные свойства
00:32:37 Прогрессивное улучшение CSS
00:36:05 Метрики шрифта
00:39:16 Инструменты PWA
00:45:20 Верните Гитхаб
00:53:20 Собеседование на бумажке
События
• Moscowcss №1 в Москве 2 марта
• KhJS №1 в Харькове 11 марта
• HolyJS в Петербурге 2—3 июня
• Видео с pitercss_meetup №10
• Видео с pitercss_meetup №9
• Видео с MinskJS
• Видео с Frontend Conf 2016 в Москве
• Как смотреть видео с фронтенд-конференций
• Video Speed Controller
Жирненький Firefox 52
• Firefox 52 for developers
• A cartoon intro to WebAssembly
История Firefox OS
Руководства по гридам
• Codrops CSS Reference: Grid
• Basic concepts of grid layout
• Learn Grid Layout Video Series
Кастомные свойства
• Основы пользовательских свойств CSS
Прогрессивное улучшение CSS
• CSS and progressive enhancement
Метрики шрифта
• Метрики шрифта, line-height и vertical-align
Инструменты PWA
• Progressive Web App Libraries in Production
Верните Гитхаб
• GitHub just rolled better contrast & a11y
Собеседование на бумажке
• Anti-whiteboard movement
• Trading whiteboards for code reviews
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:05:04 Safari TP24
00:08:43 Как работают браузеры в 2017
00:18:56 Кастомные свойства
00:36:16 Make great again
00:45:28 Новый HTML-заголовок
00:59:36 Нервный опенсорс
01:14:00 W3C против WHATWG
События
• Видео с Rolling Scopes в Минске
• Pitercss №10 в Питере
• Moscowcss №1 в Москве 2 марта
• Frontend Fellows №11 в Ижевске 3 марта
• React Amsterdam 21 апреля
• Выигрышная ошибка
Safari TP24
• Release Notes for Safari Technology Preview 24
Как работают браузеры в 2017
• Optimising the front end for the browser
• Оптимизация фронтенда под браузеры
• How Browsers Work (2011)
Кастомные свойства
• Трюк: раздельные функции CSS-трансформации
• PostCSS Transform Shortcut
• CSS Custom Properties as your API
Make great again
• Make as a front-end development build tool
Новый HTML-заголовок
• Нужен ли нам новый заголовочный элемент?
• W3C/html: Add h element
• Вложенные h1
Нервный опенсорс
W3C против WHATWG
• What is the difference between the W3C and the WHATWG?
• HTML Living Standard
• HTML 5.1 W3C Recommendation
• Логотипы WHATWG
Ведущие: Сергей Господарец, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:42 События
00:09:10 Новинки Chrome
00:28:38 Плохой Base64
00:39:34 Отладчик WebKit
00:46:00 Нативные ES-модули
00:55:18 Модули в Node.js, Webpack и V8
01:01:46 Спокойный UI
01:04:59 Книга с рыбами
01:07:01 CSS-переменные
События
• Видео с KyivJS
• Pitercss №10 в Питере 21 февраля
• MinskJS в Минске 1 марта
• Moscowcss №1 в Москве 2 марта
• MinskCSS в Минске 30 марта
• React Amsterdam 21 апреля
• Сайт pitercss_conf
• Репозиторий pitercss.com на Гитхабе
• CodeFest в Новосибирске 1—2 апреля
• Rolling Scopes 2017
• Frontend Dev Conf в Минске 6—7 апреля
Новинки Chrome
• Trailing commas in function parameters
• Throttle expensive background timers
• Object Rest/Spread Properties
• Report long tasks which block the UI
• Reload, reloaded: faster and leaner page reloads
• Web Share API brings the native sharing capabilities
Плохой Base64
• What’s Up with Base64?
• Gathering Data
Отладчик WebKit
• JavaScript Debugging Improvements
Нативные ES-модули
• Native ECMAScript modules: dynamic import()
• Making transpiled ES modules more spec-compliant
Модули в Node.js, Webpack и V8
• An Update on ES6 Modules in Node.js
• High-performance ES2015 and beyond
Спокойный UI
Книга с рыбами
• CSS: The Definitive Guide, 4th edition
• CSS. Каскадные таблицы стилей. Подробное руководство
CSS-переменные
• Houdini: CSS Properties and Values API
• You might not need a CSS preprocessor
Ведущие: Вадим Макеев, Алексей Симоненко, Милена
Темы
00:00:00 Интро
00:00:13 События
00:07:39 Графика в WebKit
00:13:51 Ссылки в Opera
00:17:33 Дизайнеры верстают
00:29:24 HTML API
00:36:48 Кастомные свойства
00:42:21 Фигуры в CSS
00:45:31 Обещанный бургер
00:50:05 Быстрый старт JS
01:01:21 Отчёты W3C TAG
События
• UralJS №2 в Екатеринбурге 13 февраля
• MoscowJS №35 17 февраля
• Weacom IT Day в Иркутске 17 февраля
• Mobile World Progress в Барселоне 1 марта
• moscowcss_meetup №1 в Москве 2 марта
• KharkivCSS №2 в Харькове 22 апреля
• Приём докладов на pitercss_conf 16 июня
Графика в WebKit
• Next-generation 3D Graphics on the Web
Ссылки в Opera
• What’s new in Chromium 56 and Opera 43
Дизайнеры верстают
• Веб-дизайнеры, начните верстать!
• Технолог — тоже дизайнер
• Как «прокачаться» дизайнеру: советы и полезные ссылки
HTML API
• HTML APIs: What They Are And How To Design A Good One
• MarkApp
Кастомные свойства
• CSS Custom Properties. The Basics
• More Readable CSS with CSS Custom Properties
• Bridging CSS and JS with Custom Properties
Фигуры в CSS
Обещанный бургер
• Обещание бургерной вечеринки
• Ты кто такой, сервис-воркер?
Быстрый старт JS
• JavaScript Start-up Performance
• optimize-js
• Preact
Отчёты W3C TAG
• Polyfills and the evolution of the Web
• Houdini: Demystifying the Future of CSS
• Add h element
• The evergreen web
• HTML Standard, WHATWG
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:02:07 Новинки Chrome
00:08:32 Установка веб-приложений
00:23:50 Баги в браузерах
00:30:44 Очевидный CSS
00:37:33 Банальный флексбокс
00:43:43 Ад колбэков
00:47:21 Нативные ES-модули
00:54:14 Сохранить в офлайне
00:55:31 Локальный HTTP2
События
• Видео с WSD в Москве
• PiterJS №12 в ИТМО 9 февраля
• Rolling Scopes в Минске 18—19 февраля
• pitercss_meetup №10 21 февраля
• moscowcss_meetup №1 2 марта
• DUMP-2017 14 апреля
Новинки Chrome
Установка веб-приложений
• The New and Improved Add to Home screen
• Google is finally making web apps first-class citizens on Android
Баги в браузерах
• Reporting Browser Bugs
• Lack of @counter-style support
• Баги в браузерах: кто виноват и что делать?
Очевидный CSS
• Using CSS variables in SVG icons
• Сила цветовой CSS-функции rgba
Банальный флексбокс
• A Complete Guide to Flexbox
• Flexbox Cheatsheet
• Битва за базовую линию
• How Flexbox works — explained with gifs
Ад колбэков
Нативные ES-модули
• Native ES-modules: new features, differences from Webpack
Сохранить в офлайне
• Implementing “Save For Offline” with Service Workers
Локальный HTTP2
Ведущие: Александра Воробьёва, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События
00:01:23 Safari 10.1
00:06:18 Chrome 56
00:09:46 Firefox 51
00:14:47 HTTPS и формы
00:21:23 Тестирование в Сбертехе
00:30:57 Новый клиарфикс
00:34:54 Импорты в CSS
00:43:34 Сервис-воркеры
00:46:19 История JS
00:56:05 Команда Сбертеха
События
• WSD в Москве 28 января
• Видео с WSD в Москве
• NodeSchool в Питере 28 января
• SPB Frontend 31 января
• CodeFest в Новосибирске 1—2 апреля
Safari 10.1
• Safari 10.1 Release Notes
• Release Notes for Safari TP 22
Chrome 56
Firefox 51
HTTPS и формы
• Communicating the Dangers of Non-Secure HTTP
Тестирование в Сбертехе
Новый клиарфикс
• The end of the clearfix hack?
• Новый display: flow-root — не clearfix, но что это и зачем?
Импорты в CSS
• Is CSS @import still considered as an anti-pattern?
Сервис-воркеры
• Mariko Kosaka: Knitting for JavaScripters
• Ты кто такой, сервис-воркер?
История JS
Команда Сбертеха
• Как работают ИТ-специалисты. Андрей Янковский, JS-тимлид CSSSR
• Сбербанк-Технологии
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:37 Лого Mozilla
00:05:56 Ввод дат
00:24:10 Чек-лист
00:28:31 Webpack 2
00:33:26 React на веб-компонентах
00:34:57 Суровый Unix
00:47:19 Доступность
События
• WSD в Москве 28 января
• KharkivCSS 22 апреля
• Rolling Scopes в Минске 18—19 февраля
Лого Mozilla
• Moz://a Arrival
• moz:// URI scheme
Ввод дат
• Date/Time Input Types
• Making input type=date complicated
Чек-лист
• Что поправить в вёрстке перед выпуском в продакшен?
Webpack 2
• Webpack 2.2: The Final Release
• Rollup.js
React на веб-компонентах
• Web Components, the React way
Суровый Unix
• Ack for CSS Developers
• Вместо ack уже ripgrep
• Ripgrep
• Tower
• WebVim
• Всё, что вы делаете в Vim неправильно
• Panic Themes
• Icon Slate
• ImageMagick
Доступность
• How I do an accessibility audit
• Accessibility Devtools Extension
• axe-core
• Using the aria-current attribute
Ведущие: Вадим Макеев, Алексей Симоненко, Слава Шебанов
Темы
00:00:00 Интро
00:00:24 События
00:10:06 JS-модули и global
00:18:08 Бета PhantomJS
00:20:20 Веб-манифест
00:21:52 ВК и PWA
00:32:58 ВК и доступность
00:42:27 Методологии CSS
00:47:26 Кастомные свойства
00:50:52 SVG-иконки
00:52:51 ВК и кастомные шрифты
01:01:30 Динамический импорт JS-модулей
События
• pitercss_meetup №9 в Yota 24 января
• WSD в Москве 28 января
• SPB Frontend
• Papers We Love. SPB
JS-модули и global
• Release Notes for Safari Technology Preview 21
• Mozilla: Intent to Implement ES6 modules
• JavaScript Loader Standard
• Remove global from FF Nightly
Бета PhantomJS
Веб-манифест
ВК и PWA
ВК и доступность
• Добьёмся доступности ВК для незрячих
Методологии CSS
• What’s in a name? A CSS naming convention overview
• Ничего ты не знаешь, Джон Сноу. Фронтенд ВК
Кастомные свойства
• Random Numbers in CSS
• Reactive Animations with CSS Variables
SVG-иконки
• The Road to SVG and Custom Elements in Clarity Icons
ВК и кастомные шрифты
Динамический импорт JS-модулей
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:19 События
00:04:04 Адаптивный дизайн
00:15:56 Переход на CSS
00:33:23 Ванильный JS
00:37:25 Жестокий опенсорс
00:48:00 Доступные примеры
00:50:35 Аутлайн
00:58:20 Вёрстка логотипа
События
• WSD в Москве 28 января
• Rolling Scopes в Минске 18—19 февраля
• pitercss_meetup в январе
• pitercss_conf 16 июня
• CSS Day в Амстердаме 15—16 июня
• Фронтирник №3
Адаптивный дизайн
• The Current State of Adaptive Design
• Affinity Designer 1.5: Constraints
Переход на CSS
• From Sass to PostCSS
• CSS Working Group Editor Drafts
• Step-by-step Publishing a CSS Spec
Ванильный JS
• How I converted my React app to VanillaJS
Жестокий опенсорс
• Dear JavaScript
• Дорогой JavaScript
Доступные примеры
• Accessibility OpenAjax Examples
Аутлайн
• Что касается аутлайна
• Кодельная
• Ишья на Гитхабе
• A { outline: none } Don’t Do It!
• Reset Revisited
Вёрстка логотипа
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:01:02 События года
00:12:24 Всегда кодить
00:17:52 Доклады года
00:25:30 Веб-стандарты
00:32:42 Браузеры года
00:35:56 Больше CSS
00:39:20 Прогрессор
00:41:35 Закрытие года
00:44:27 Тренды года
00:52:54 Новички и наставники
00:59:51 Ещё тренды
01:02:18 Флексбокс года
01:04:49 JavaScript года
01:13:08 Что будет в 2017
События года
• ScotlandCSS
• HolyJS
• Frontend Union Conf
• Pitercss_conf
• Prosmotr
• OdessaJS
• KharkivJS
• FrontTalks
Всегда кодить
• The best software developers I know…
• To the guy who wrote that “Always Hacking” tweet
Доклады года
• Как я перестал верить технологиям
• Как незрячие люди видят ваш сайт
• Производительность JS через подзорную трубу
• Я и ИоТ
Веб-стандарты
• WSD
• Фото с WSD
Браузеры года
• Safari TP
• Samsung Internet DevRel
Больше CSS
Прогрессор
Закрытие года
• Восемь лет в Opera
• Leaving Opera
• What a coincidence!
Тренды года
• RioRun
• Paper Planes
• Let’s Encrypt
• Certbot
Новички и наставники
• Статьи Алёны Батицкой
• Путь наставника
• Фронтенд для новичка
• Как я попала в Яндекс
• Старикам здесь не место?
JavaScript года
Что будет в 2017
• Можно вообще всё. Раскладка по гриду
• CSS Variables: var(--subtitle)
• Пользовательские свойства как основа архитектуры CSS
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:39 Safari TP20
00:06:07 Samsung Internet
00:10:14 Firebug и… Photoshop
00:22:00 Bootstrap и флексы
00:29:21 GitHub Pages
00:31:59 CSS 2017
00:39:06 Вставка шрифтов
00:45:35 Полифилы CSS
00:52:44 Специфичность CSS
События
• WSD в Москве 28 января
• Видео с pitercss №8
• SPB Frontend 26 декабря
Safari TP20
• Release Notes for Safari Technology Preview 20
• A tale of two viewports — part one
• A tale of two viewports — part two
Samsung Internet
• Announcing Samsung Internet 5.0
Firebug и… Photoshop
• Firebug lives on in Firefox DevTools
Bootstrap и флексы
GitHub Pages
CSS 2017
• Рабочая группа CSS определяет состав CSS-2017
Вставка шрифтов
• No @font-face Syntax will ever be Bulletproof
Полифилы CSS
• The Dark Side of Polyfilling CSS
• Loading Polyfills Only When Needed
Специфичность CSS
Ведущие: Ольга Алексашенко, Вадим Макеев
Темы
00:00:00 Интро
00:00:18 События
00:04:35 Chromium и Opera
00:08:19 Возвращение position: sticky
00:11:49 Виртуальная реальность
00:16:40 Приоритизация JS
00:21:51 Быстрый параллакс
00:25:29 Инлайновый SVG лучший!
00:30:35 Краткая запись CSS
00:36:39 Контрольные точки
00:40:47 Гриды!
00:44:56 20 лет CSS
События
• Видео с MinskCSS №1
• WSD в Москве 28 января
• Встреча по фронтенду СКБ Контур в Екатеринбурге
• Работа фронтендера в крупной IT-компании
• Доступность для незрячих
• Приём докладов на KharkivCSS
Chromium и Opera
• What’s new in Chromium 55 and Opera 42
Возвращение position: sticky
Виртуальная реальность
• Chrome: WebVR
• Очки виртуальной реальности «Кардборд»
• A-Frame
Приоритизация JS
• When everything’s important, nothing is!
Быстрый параллакс
Инлайновый SVG лучший!
• Why Inline SVG is Best SVG
• SVG 2, W3C CR
Краткая запись CSS
• Краткая запись CSS как антипаттерн
Контрольные точки
• Правильный способ делать контрольные точки в CSS
Гриды!
20 лет CSS
Ведущие: Сергей Бережной, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:19 События
00:04:30 Новинки Edge
00:11:27 Safari TP 19
00:26:49 Где учиться
00:35:58 Сообщения коммитов
00:42:59 Анимация и рендеринг
00:49:54 CSS в CSS
01:02:52 Хайп
01:12:24 Прогрессивное улучшение
События
• Я.Субботник по фронтенду
• HolyJS в Москве 11 декабря
• Билеты на JSConf
• Билеты на CSSConf
Новинки Edge
• Edge on Windows 10 build 14986
Safari TP19
• Release Notes for Safari TP 19
• Не гзипом единым, Георгий Мостоловица
Где учиться
• Куда пойти учиться программисту
Сообщения коммитов
• Как писать сообщения коммитов
Анимация и рендеринг
• Анимации на GPU: делаем это правильно
CSS в CSS
• Virtual CSS with Styletron
• Styled JSX
• A new world: writing CSS in ClojureScript and life after Sass
Хайп
Прогрессивное улучшение
• The Case Against PE’s Flimsy Moral Foundation
• Insert Clickbait Headline About PE Here
• Yes, PE is a fucking moral argument
• The True Cost of Progressive Enhancement
• What the Heck Is Inclusive Design?
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:57 Chrome 55
00:11:10 Отладка гридов в Firefox
00:12:55 Парсер URL в WebKit
00:16:20 PWA как APK
00:18:21 Справочник по CSS
00:23:40 @supports
00:33:04 CSS-in-JS и бэктики
00:42:21 Шрифты в Медузе
00:52:57 Инструменты 2016
События
• RealtimeBoard TechDays в Перми 4 декабря
• Митап по БЭМу для новичков в Яндексе 9 декабря
• Я.Субботник по фронтенду в Москве 10 декабря
• HolyJS в Москве 11 декабря
• Pitercss №8 в офисе DataArt 21 декабря
• NodeSchool SPB в офисе Selectel 24 декабря
Chrome 55
• Chrome 55: Async and Await, Pointer Events, Persistent Storage
• Now shipping Node v7, with preliminary support for async/await!
• V8 Release 5.6
• www-style: scroll anchoring
Отладка гридов в Firefox
• CSS Grid and Grid Highlighter Now in Firefox Developer Edition
Парсер URL в WebKit
PWA как APK
• Paul Kinlan: What Comes Next for the Web?
• Installing web apps on phones (for real)
Справочник по CSS
@supports
• @supports изменит вашу жизнь
• Поддержка на Can I Use…
• Fallback for browsers not supporting CSS Grid Layout
CSS-in-JS и бэктики
• The magic behind styled-components
Шрифты в Медузе
• Как использовать кастомные шрифты в вебе и не сойти с ума
• Статьи Зака Лезермана
• Паттерны загрузки веб-шрифтов
• Homebrew web font tools
Инструменты 2016
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:04:07 Новости Firefox
00:14:04 Веб-компоненты в WebKit
00:16:34 Мультиколонки
00:20:32 Системы раскладки
00:31:12 SVG-паттерны
00:34:30 Нюансы доступности
00:38:45 Методологии CSS
00:50:11 Улучшение формы
00:51:42 Шоу «Стандарт»
00:53:42 Фолбэки к шрифтам
00:57:25 HTML на стероидах
01:03:17 Подкаст жив!
События
• WSD в Киеве прошёл 26 ноября
• Krasnodar Dev Days 10 декабря
• FrontDays №4 в Тольятти 17 декабря
• Я.Субботник в Москве 10 декабря
• HolyJS в Москве 11 декабря
• [email protected] для докладов на pitercss
• Приём докладов на CodeFest
• Приём докладов на React Amsterdam
Новости Firefox
• Mozilla: Intent to implement Payment Request API
• Firefox: New Responsive Design Mode
Веб-компоненты в WebKit
• WebKit: Introducing Custom Elements
Мультиколонки
• Lea Verou: inline-block prevents fragmentation in multi-column containers
Системы раскладки
• Грид, флексбокс и выравнивание блоков
• Should I try to use the IE implementation of CSS Grid Layout?
SVG-паттерны
Нюансы доступности
• The Accessibility Difference Between aria-hidden and role="presentation"
• Changing the Reading Order of a Page with aria-flowto
Методологии CSS
• Holy Grail Layout
• When to use which CSS methodology
Улучшение формы
• Улучшение формы комментариев
Шоу «Стандарт»
• The Standard E02: Fit to Page
Фолбэки к шрифтам
HTML на стероидах
• AMP, Instant Articles, Instant View
Подкаст жив!
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События
00:02:14 Opera DevRel всё
00:06:04 Safari TP 18
00:09:29 Firefox 50
00:13:26 CSS-шлюзы
00:19:45 Расширение инлайновых стилей
00:25:06 Печать
00:35:43 Гриды весной
00:45:48 Новый dl
00:48:19 Atom без Shadow DOM
00:57:15 42
00:57:41 Медиум
События
• Pitercss №7 прошёл
• [email protected] для докладов и предложений
• MoscowJS №34 24 ноября
• Я.Субботник по фронтенду в Москве 10 декабря
• HolyJS в Москве 11 декабря
• MinskCSS 15 декабря
Opera DevRel всё
• Bruce Lawson: Leaving Opera
• Opera сократила 85 человек из-за падения выручки от b2b-бизнеса
• Резюме Вадима
Safari TP 18
• Release Notes for Safari Technology Preview 18
Firefox 50
• Firefox 50, обзор Марата Таналина
CSS-шлюзы
• Математика CSS-шлюзов на Хабре
• Математика CSS-шлюзов на CSS Live
• Shower
• Словарь терминов по фронтенду
Расширение инлайновых стилей
• Expand inline style attributes to allow pseudo-class/element styling
Печать
• I totally forgot about print style sheets
• Распечатай Яндекс.Карты, Вадим Макишвили
• Tracking When Users Print Pages
Гриды весной
• Intent to ship in Chrome 57
• Intent to ship in Firefox 52
• Grid Kiss
• Opera Mini server upgrade
Новый dl
• DIV официально разрешён внутри DL
Atom без Shadow DOM
• Removing Shadow DOM boundaries from text editor elements
• Avoiding Style Pollution With The Shadow DOM (2014)
42
• Веб-стандарты 42
• RadioJS 42
• 42
Медиум
Ведущие: Вадим Макеев, Андрей Оконечников, Алексей Симоненко
Темы
00:00:00 Интро
00:02:38 События
00:06:56 Safari TP 17
00:16:41 Доступность
00:26:31 Fetch не торт
00:34:35 Результаты 10K Apart
00:36:45 Вредные советы
00:40:37 Людоедский фронтенд и JS-in-JS
События
• Профессия фронтенд-архитектор, РИТ 2007
• Chrome Dev Summit
• WSD в Киеве 26 ноября
• Видео с WSD в Минске
• MinskCSS 15 декабря
• HolyJS в Москве 11 декабря
Safari TP 17
• Release Notes for Safari Technology Preview 17
• What’s new in IndexedDB 2.0?
• Safari 10 supports WOFF2 but I only see WOFF loading
• WOFF2 на Can I Use
• ColorSnapper
Доступность
• Доступность сайтов для самых маленьких
• Госсайт, доступный для людей с ограниченными возможностями
• WAVE Evaluation Tool
Fetch не торт
• Why I won’t be using Fetch API in my apps
Результаты 10K Apart
• Announcing the winners of the 2016 10k Apart contest
Вредные советы
• Как отравить мобильного пользователя
Людоедский фронтенд и JS-in-JS
• CSS Modules
• Styled Components
• Andrew Clark: What’s Next for React
• JS Worker Search
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:17 События
00:03:08 HTML 5.1
00:05:40 Async в Firefox
00:07:38 Вариативные шрифты
00:13:19 Календарик
00:20:44 Опасные API
00:24:45 WebAssembly
00:26:43 Шаблонные литералы
00:31:40 Загрузка JS
00:38:51 position: sticky
00:41:32 Круговой прогресс-бар
00:44:40 Опрос Stack Overflow
00:50:34 Тесты и игрушки
События
• Видео с FrontTalks
• Pitercss №7 16 ноября
• NodeSchool SPB 19 ноября
• WSD в Киеве 26 ноября
• MinskCSS 15 декабря
• React Amsterdam 21 апреля
HTML 5.1
• XHTML Fist
• HTML 5.1 W3C Recommendation
• HTML 5.1 Changes
Async в Firefox
• Async/await support in Firefox
Вариативные шрифты
• WebKIt: Variable Fonts on the Web
Календарик
• Firefox: Data/Time picker
• HTML 5.1: input type="date"
Опасные API
• Browsers remove functionality due to privacy
• What is Do Not Track?
WebAssembly
• The WebAssembly Browser Preview has launched!
Шаблонные литералы
• ES6 Template Literals, the Handlebars killer?
Загрузка JS
• RFC: Webpack Performance Budgets
• Alex Russell: How broken JS-first web development is
position: sticky
• Chrome: Intent to Ship CSS position: sticky
Круговой прогресс-бар
• Making a Doughnut Progress Bar
Опрос Stack Overflow
• Stack Overflow: Survey Results 2016
Тесты и игрушки
• JavaScript Guessing Game
• HTML parser quiz
• HTML Minifier
• Enki
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:25 События
00:06:40 Chromium 54
00:09:35 Safari TP 16 и Apple Pay
00:16:58 Mozilla, Servo, разработка движков
00:36:33 Таблицы по стандартам
00:38:47 Node.js 7
00:41:03 Стандарты и полифилы
00:46:24 Забытый border-image
00:52:05 Базовый SVG
00:52:52 Возвращение Дейва Шей
События
• Видео с WSD в Минске
• Слайды с WSD в Минске
• PiterJS 3 ноября
• KharkivJS 5—6 ноября
• Chrome Dev Summit 10—11 ноября
• Fronthub в Ульяновске 12 ноября
• PenzaJS 17 ноября
• Pitercss №7 16 ноября
• MinskCSS 15 декабря
• WSD в Киеве 26 ноября
• Канал events в Слаке
Chromium 54
• What’s new in Chromium 54 and Opera 41
Safari TP 16 и Apple Pay
• Release Notes for Safari Technology Preview 16
• EmporiumWeb, пример Apple Pay
• Apple на Гитхабе
Mozilla, Servo, разработка движков
• A Quantum Leap for the Web
• Mozilla’s Quantum Project
Таблицы по стандартам
Node.js 7
Стандарты и полифилы
• Add document.{interactive,contentLoaded,loaded} promises
• Please rename ASAP
Забытый border-image
• Ещё раз про border-image
• Can I Use: border-image
• Slicing SVG 9 Ways
Базовый SVG
• Как проектировать, создавать и анимировать SVG
Возвращение Дейва Шей
• Photo Toning with Gradients & Blend Modes
• CSS Zen Garden
• The source of csszengarden.com
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:02 Chrome 54
00:05:29 Async
00:10:40 Node.js v6 LTS
00:19:40 Npm v4.0.0
00:20:55 Ире про PWA
00:27:24 Условия в CSS
00:35:11 CSS-фреймворк не нужен
00:41:58 Адаптивный Яндекс
00:43:19 Полифил для гридов
00:45:35 Normalize.css?
00:52:20 Женщины в ИТ
События
• WSD в Киеве 26 ноября
• Принимаем заявки на pitercss в ноябре и декабре: [email protected]
• CodeFest 1—2 апреля
Chrome 54
• Chrome 54, Пит Лепаж
• Cross-origin Service Workers: Experimenting with Foreign Fetch
Async
• Async functions: making promises friendly
• Tips for using async functions (ES2017)
Node.js v6 LTS
• Node.js v6 Transitions to LTS
• v7.0.0 Proposal
• Firefox ESR
• Homebrew
Npm v4.0.0
Ире про PWA
• Offline First with Service Worker
• Instant Loading with IndexedDB
• Instant Loading Web Apps with an Application Shell Architecture
• Intent to Ship: Durable (Persistent) Storage
Условия в CSS
CSS-фреймворк не нужен
• Статья: You might not need a CSS framework
• Видео: You might not need a CSS framework
• Это тебе не нужен, а нам нужен…
Адаптивный Яндекс
• Адаптивная вёрстка, ШРИ 2016
Полифил для гридов
Normalize.css?
• Normalize (CSS) No More
• Continue Normalising Your CSS
• О normalize.css
Женщины в ИТ
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:57 Yarn для npm
00:20:02 Safari TP 15
00:24:28 Web Bluetooth
00:25:57 Хорошие таблицы
00:35:07 Alt для картинок
00:43:06 Женщины CSS
00:46:57 Функция map в CSS
00:53:45 Стили без CSS
00:57:14 JS (не) нужен?
01:04:51 Прогрессивное улучшение
События
• NodeSchool SPB 22 октября
• React Moscow 26 октября
• WSD в Минске 29 октября
• KharkivJS 5—6 ноября
• HolyJS в Москве 11 декабря
Yarn для npm
• Yarn: A new package manager for JavaScript
• PackRat
• Hello, Yarn!
• Why I’m Working on Yarn
• Почему yarn.lock не нужен в зависимостях
Safari TP 15
• Release Notes for Safari Technology Preview 15
Web Bluetooth
• Chrome Intent to Ship: Web Bluetooth
Хорошие таблицы
• How to make your tables less terrible (GIF)
• Создавайте хорошие таблицы
Alt для картинок
• Альтернативный текст для изображений
Женщины CSS
Функция map в CSS
• Native map() function in CSS
Стили без CSS
JS (не) нужен?
• You Might Not Need jQuery
• You Might Not Need JavaScript
• You Might Need JavaScript
Прогрессивное улучшение
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:19 События
00:03:53 Не обижайте CSS
00:13:35 Флекс-хак
00:17:35 Фреймворк на флексах
00:24:33 JS в 2016
00:36:09 Состояние JS
00:38:56 PWA и React
00:45:42 Без джаваскрипта жизнь не та?
00:54:38 Не блокируйте вьюпорт
События
• Pitercss №6 11 октября
• Progressive Web Apps Day 11 октября
• WSD в Минске 29 октября
• KharkivJS 5—6 ноября
• Конференция pitercss в июне 2017
Не обижайте CSS
• Может, хватит уже поливать CSS грязью?
• CSS is Awesome в спецификации
Флекс-хак
Фреймворк на флексах
JS в 2016
• Как оно учить JavaScript в 2016
• It’s the future
• Totally get your frustration
• Пример из Python, алгоритмы не нужны
• How it actually feels to write JavaScript in 2016
Состояние JS
PWA и React
• PWA with React: Introduction
• PWA with React: Page Load Performance
• PWA with React: Offline support
Без джаваскрипта жизнь не та?
• Fronteers
• It’s ok to build a website that doesn’t work without JS
• I’m exasperated by this push to require JS / get rid of CSS
• Offline, progressive, and multithreaded, Нолан Лоусон
• Roving tabindex. A11ycasts 06
Не блокируйте вьюпорт
• HTML 5.2: The meta element
• Всегда отключаю масштабирование!
• PWA Rocks
• Washington Post
• Financial Times
Ведущие: Ольга Алексашенко, Алексей Симоненко
Темы
00:00:00 Интро
00:00:25 События
00:08:51 Safari TP 14
00:10:45 Async и await в Chrome
00:13:03 Куда двигается HTML
00:16:24 Сложности с JS-модулями
00:22:00 Недооценённый CSS
00:27:21 Больший потенциал SVG
00:30:41 Псевдоэлементы
00:35:26 Доступность
00:39:06 Длинные классы в БЭМе
00:41:04 Отладчик в 108 байтах
00:42:44 Загрузка полифилов
00:47:34 История React
События
• WSD в Питере 1 октября
• WSD в Минске 29 октября
• pitercss meetup №6 11 октября
• pitercss conf в июне 2017
Safari TP 14
• Release Notes for Safari Technology Preview Release 14
Async и await в Chrome
• Async/await landed in Chrome
Куда двигается HTML
Сложности с JS-модулями
Недооценённый CSS
• 9 недооценённых возможностей CSS
Больший потенциал SVG
Псевдоэлементы
• Псевдоэлементы, которых не может быть
Доступность
• Hiding inline SVG icons from screen readers
• Всегда используйте label
Длинные классы в БЭМе
Отладчик в 108 байтах
• 108 byte CSS layout debugger
• Web Developer
Загрузка полифилов
• Loading Polyfills Only When Needed
История React
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:18 События
00:06:01 Firefox 49
00:08:09 Chromium 53
00:14:17 Pointer Events
00:23:09 Гриды
00:28:48 SVG
00:31:07 Google про PWA
00:31:58 Что мешает Bootstrap
00:33:39 Оптимизация скобками
00:37:42 Как доступно прятать
00:41:17 Советы начинающим
События
• MoscowJS Conf
• SPB Frontend 26 сентября
• WSD в Питере 1 октября
• Fronteers 6—7 октября
• PiterCSS 11 октября
• Progressive Web Apps Day 11 октября
• Chrome Dev Summit 10—11 ноября
Firefox 49
Chromium 53
• What’s new in Chromium 53 and Opera 40
• Свойства scale, rotate и translate
Pointer Events
• Intent to Ship: Pointer Events
• Роман Дворнов про Touch Events и Pointer Events
• Touch Events, W3C Recommendation
• Touch Events Level 2, Draft
• Pointer Events, W3C Recommendation
• PEP.js
Гриды
• CSS Grid meets the real world: a login form
• The CSSWG voted to send Grids Layout to CR
• Proposal for a new Region Spec, Jen Simmons
• Percentages and intrinsic size, Manuel Rego
SVG
• URL-encoder для SVG
• Инлайновые стили в background-image
Google про PWA
• Air Berlin: реализация Progressive Web App
• Секреты Progressive Web Apps: часть 1
Что мешает Bootstrap
Оптимизация скобками
Как доступно прятать
• A11y.js: Hiding DOM elements
Советы начинающим
• Вёрстка интерактивного баннера
• Как быть начинающим и не сойти с ума
Ведущие: Роман Дворнов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:10 Новинки Гитхаба
00:06:38 Браузеры
00:11:19 HTML и SVG
00:19:19 Новые API
00:23:01 Вёрстка писем
00:26:13 Вариативные шрифты
00:30:23 Веб-шрифты в 2016
00:32:33 JS для дизайнеров
00:35:45 Sass 3.5
00:39:09 Сомнения в PostCSS и @viewport
00:51:57 Рома и парсер CSSTree
События
• FrontTalks
• MoscowJS 24 сентября
• PiterCSS 11 октября
Новинки Гитхаба
• GitHub: A whole new Universe
Браузеры
• Chrome 54 Beta
• BroadcastChannel
• WebUSB
• Safari Technology Preview Release 13
HTML и SVG
• Новые статусы HTML5.1 и SVG2
• SVG Authoring Guide
Новые API
• Новые API: акселерометр, гироскоп, магнитометр
Вёрстка писем
• Gmail to Support Responsive Design, Improved Font Styling
Вариативные шрифты
• Variable fonts, a new kind of font for flexible design
• Introducing OpenType Variable Fonts
Веб-шрифты в 2016
• Шрифты в вебе, обзор от 2016 года
• Font Family Reunion
JS для дизайнеров
• Javascript for Web Designers
Sass 3.5
Сомнения в PostCSS и @viewport
• Preprocess future-proof CSS features
• @viewport removed from Edge
• @viewport is preloader-hostile
Рома и парсер CSSTree
• Basis.js. Почему я не бросил разрабатывать свой фреймворк
• CSSO
• Gonzales
• Rework
• CSSTree
• CSSTree Validator
• CSSOM
Ведущие: Павел Ловцевич, Вадим Макеев, Олег Мохов, Алексей Симоненко
Темы
00:00:00 Интро
00:00:24 Гости
00:01:15 События
00:04:46 Несмелый Safari
00:11:22 Доступность
00:20:10 Меняем порядок
00:28:08 Фронтенд в Mail.Ru
00:35:26 Зачем вообще PWA
00:47:26 HTTPS без вариантов
00:58:13 Кастомные свойства
01:01:54 Строчный код
01:06:49 Платные конференции
Гости
• Павел Ловцевич @zigzag_mcquack
• LOVATA
• Олег Мохов @olmokhov
• FrontTalks
События
• FrontTalks 17—18 сентября
• WSD в Питере 1 октября
• WSD в Минске 29 октября
• PiterJS в Питере 22 сентября
Несмелый Safari
Доступность
• Недоступный веб: как мы развели такой бардак
• What is the Business Case for Accessibility?
• Section 508
• Расшифровки подкаста
Меняем порядок
• Способы смены порядка элементов с помощью CSS
• PWA.rocks
Фронтенд в Mail.Ru
• Инструменты для разработки и поддержки фронтенда
• Gemini
Зачем вообще PWA
• The Building Blocks Of Progressive Web Apps
• 4 вида утечек памяти в JavaScript и как с ними бороться
• Отладка пререндера: chrome://net-internals/#prerender
HTTPS без вариантов
• Moving Towards a More Secure Web
• Let’s Encrypt
Кастомные свойства
• Autoprefixing, with CSS variables!
• CSS Custom Properties in development in Edge
Строчный код
• Оформление строчных блоков кода
Платные конференции
Ведущие: Вадим Макеев, Анна Селезнёва, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:01:31 Аня, представься
00:08:37 Safari 10, скоро
00:12:21 Chrome 53, уже
00:22:27 Кастомные элементы
00:32:34 Компоненты по старинке
00:36:27 Слайсинг в border-image
00:40:25 Очень ждём font-display
00:44:12 Лия Веру и HTML
00:50:28 Вомбаты в носках и npm
События
• KharkivCSS 17 сентября
• FrontTalks 17—18 сентября
• WSD в Питере 1 октября
• WSD в Минске 29 октября
Аня Селезнёва
• Твиттер @asktwi
• Личный сайт askd.rocks
• Адаптивный веб-дизайн — Что? Где? Когда?
• Rolling Scopes
• Web Not Bombs
• 4front
• Злые марсиане
Safari 10
• WebDriver support in Safari 10
• Safari TP12
Chrome 53
• Chrome 53
• Web Bluetooth API
• Payment Request API
• Shadow DOM v1
Кастомные элементы
• The Case for Custom Elements, 1
• The Case for Custom Elements, 2
• Demystifying Web Components
Компоненты по старинке
• Developing Extensible HTML and CSS Components
Слайсинг в border-image
• Supercharged
• Slicing SVG 9 Ways
• Can I Use
Очень ждём font-display
• Font-display for the Masses
• Font Face Observer
Лия Веру и HTML
• HTML Secrets
• CSS Secrets
• Markapp
• Пишите меньше кода, блин
• Building in 10k
Вомбаты в носках и npm
• 11 Simple npm Tricks
• Np, a better npm publish
• Npm-check-updates
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:24 События
00:07:55 WebKit 15 лет
00:13:12 WebP в Firefox
00:22:59 Безопасность сайтов
00:27:34 Прогрессивные веб-приложения
00:34:16 PostCSS в WebStorm
00:42:19 Образование для профи
00:50:03 Генераторы статики
События
• Frontend Union Conf 27 августа в Вильнюсе
• «Elements», слайды Мартина Клеппе
• JS Hacks & Creativity
• KharkivJS в начале ноября
• FrontTalks 17—18 сентября в Екатеринбурге
• Лог с JSConf Iceland, день первый и второй
WebKit 15 лет
• The first commit to WebKit was 15 years ago today
• Celebrating 15 Years of WebKit
WebP в Firefox
• Mozilla plans to add WebP support to Firefox
• Daala
• Проголосовать за WebP в Edge
Безопасность сайтов
• Observatory, сервис Mozilla для проверки безопасности
• SSL Config Generator
Прогрессивные веб-приложения
• PWA Rocks
• How we made the RioRun progressive web app
• From Chrome Apps to the Web
• Add to Homescreen on Desktop
PostCSS в WebStorm
• WebStorm 2016.3 Early Access Preview: Flow, PostCSS, and more
• PostCSS на Википедии
• Renting software sucks
Образование для профи
• Front End Center
• Перевод книги «Секреты CSS»
Генераторы статики
• Jekyll Admin
• Dev.Opera на Гитхабе
• Сайт «Веб-стандартов»
• Metalsmith
• WSD на Гитхабе
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:29 События
00:02:24 Зачем чинить старьё
00:07:41 Мысли про React
00:21:07 SMIL снова можно?
00:28:23 Скрывать по-новому
00:34:56 Народ.ру на Гитхабе
00:41:37 Сайт на 10 КБ
00:46:03 Интернет в отпуске
События
• FrontendFellows №8 в Ижевске 26 августа
• Frontend Union в Вильнюсе 27 августа
• WSD в Питере 1 октября в ИТМО
• WSD в Минске 29 октября в Space
• HolyJS в Москве 11 декабря
Зачем чинить старьё
• Починили marquee в Safari TP11
• На сайте РЖД есть marquee
• Take blink Back!
Мысли про React
• What is React
• Talked to the lawyers about patents clause…
• Сказка о потерянном времени
SMIL снова можно?
• Intent to deprecate: SMIL
• Гипножаба на SMIL
Скрывать по-новому
• The proposed box-suppress property
Народ.ру на Гитхабе
• Simpler GitHub Pages publishing
• Википедия про Яндекс.Народ
Сайт на 10 КБ
• A List Apart
• Конкурс 10K Apart
• CSS1K и JS1K
• Твиттер @140bytes
• Offline Text Editor in less than 140 bytes
Интернет в отпуске
Ведущие: Роман Комаров, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:21 События
00:02:09 Похороны Flash
00:15:08 Samsung Internet
00:26:09 Хорошая книга по CSS
00:30:12 Цветовые функции в рантайме
00:41:07 SVG
00:49:33 Курсор для кнопки
События
• WSD в Питере 1 октября
• WSD в Минске 29 октября
• Frontend Union в Вильнюсе 27 августа
• Летняя школа по Node.js в Киеве весь август
Похороны Flash
• Flash and Chrome
• Thoughts on Flash
• Clippy
• Introducing sIFR: The Healthy Alternative to Browser Text
• Appear.in, видеочат в браузере
Samsung Internet
• Introducing Samsung Internet for developers
Хорошая книга по CSS
• Книга «Секреты CSS. Идеальные решения ежедневных задач»
Цветовые функции в рантайме
• Building Themes with CSS4 Color Features
SVG
• SVG-градиенты
• SVG 2 new features
• Глава из «Practical SVG» Криса Койера
• Генератор спрайтов с фолбэком на PNG
Курсор для кнопки
• Some pointers on default cursors
• Buttons shouldn’t have a hand cursor
• Правильный курсор на активных элементах
• CSS3 UI: Cursor
• Pointer Sisters: Changing The Browser’s Cursor with CSS
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:02 Chromium 52 и Opera 39
00:06:35 Firefox 48
00:09:25 EdgeHTML 14
00:21:44 Safari TP 10
00:22:55 Будущее сервис-воркеров
00:27:44 Чистый SVG
00:37:31 Безопасный SVG
00:40:24 CSS-демки
00:44:49 Заливка текста
00:48:37 Адаптивная вёрстка
События
• FrontTalks 17—18 сентября
• Расписание WSD
• Встречи PiterCSS
Chromium 52 и Opera 39
• What’s new in Chromium 52 and Opera 39
• CSS-изоляция
Firefox 48
• Марат Таналин про Firefox 48
• WebExtensions API
EdgeHTML 14
• Introducing EdgeHTML 14 with the Windows 10 Anniversary Update
• 100% API доступности HTML5 в Edge
• Edge обошёл Firefox на HTML5 Test
Safari TP 10
• Safari Technology Preview Release 10
Будущее сервис-воркеров
• Service worker meeting notes
• The state of Web Components
Чистый SVG
Безопасный SVG
• SVG uploads in WordPress (the Inconvenient Truth)
• Safe SVG
CSS-демки
• Индикатор прокрутки на CSS и как сделано
Заливка текста
• Firefox: background-clip: text
• CSS Fill and Stroke
• Позвольте представить: SVG
• Оживляем текст
• Статьи Юли Бухваловой
Адаптивная вёрстка
• Яндекс: делать ли мобильную версию?
• Комментарий разработчика
• CSS Device Adaptation: @viewport
• @viewport на Can I use
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:26 События
00:04:57 Инлайновое видео в iOS
00:08:09 ChakraCore на Mac и Linux
00:25:12 Модальные окна
00:32:43 Сложные таблицы
00:37:13 Формы и доступность
00:44:04 Чехарда с цветовыми функциями
События
• MoscowJS №32
• Черновик расписания WSD
• Первый WSD в Яндексе
• FrontTalks 17—18 сентября
Инлайновое видео в iOS
ChakraCore на Mac и Linux
• Bringing ChakraCore to Linux and OS X
• Why ChakraCore matters
• nodejs/vm
• mozilla/spidernode
Модальные окна
Сложные таблицы
• Lessons from building mobile-friendly, accessible data tables
Формы и доступность
• Using the fieldset and legend elements
• Totally Tooling Tips
• Accessible UI Components For The Web
Чехарда с цветовыми функциями
• Switch all the color functions to be space-separated
• CSS Function Syntaxes (color and otherwise)
• Incomplete List of Mistakes in the Design of CSS
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:17 Браузеры
00:08:14 Safari и MathML
00:14:12 Font-display в Firefox
00:18:12 Будущее WebP и WebM
00:29:46 Зачем HyperTerm?
00:37:32 Книги
00:40:00 Путь фронтендера
События
• KharkivCSS 17 сентября
• LvivJS 27 августа
• HolyJS 10 декабря
Браузеры
• Chrome 52: Contain Property, the PerfObserver API & SW Stream
• CSS Containment
• Performance Observer API
• Performance measurements through requestAnimationFrame
• Battery Status API
• Service Worker Streamed Responses
Safari и MathML
• Release Notes for Safari Technology Preview Release 9
• Improvements in MathML Rendering
• MathML is a failed web standard
Font-display в Firefox
• Experimental font-display support in Firefox
• Firefox Platform Status
Будущее WebP и WebM
• Apple tests Google graphics format to speed up websites
• Lepton image compression: saving 22% losslessly from images at 15MB/s
Зачем HyperTerm?
Книги
• ВСТ рекомендует книги
• Practical SVG
• High Performance Images
• Версия в PDF
Путь фронтендера
• Frontend Dev: хороший
• Frontend Dev: плохой
• Frontend Dev: злой
Ведущие: Антон Виноградов, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:03:03 Плагины для Atom
00:10:44 Доступность
00:14:26 Загрузка шрифтов
00:19:59 Введение в промисы
00:26:16 Векторные эффекты
00:29:10 Кто такой Антон Виноградов?
00:39:39 Инструменты для дизайнеров
00:58:13 Расшифровки подкаста
События
• IT Global Meetup
• Frontend Union Conf, промо-код WelcomeWST со скидкой 15%
• MoscowJS №32
• FrontendFellows в Астане 29 июля
• FrontendFellows в Алматы 30 июля
• WSD осенью, заявки на [email protected]
Плагины для Atom
• Atom treasures, a list of Atom plugins I can’t live without
• HyperTerm, терминал на Electron и веб-технологиях
• Atom Minimap
• Atom Pair
Доступность
• ChromeLens
• Accessibility Developer Tools
• A11y Command-line Tools
Загрузка шрифтов
• A Comprehensive Guide to Font Loading Strategies
• CSS Font Rendering Controls
• Can I use: font-display support
Введение в промисы
Векторные эффекты
Кто такой Антон Виноградов?
• Антон Виноградов
• Данила Ковчий
• Антон Шеин
• Роман Шамин
• Design Prosmotr
• О чём смеются верстальщики
• Школа дизайна Яндекса
Инструменты для дизайнеров
• Next-Generation RWD Tools: Webflow, Edge Reflow, Macaw
• Protein
• Protein Dynamics for Sketch
• Framer
Расшифровки подкаста
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:14 События
00:05:23 Новости браузеров
00:14:06 Цвета в вебе
00:25:41 Практика
00:41:47 Портфолио
00:55:50 О подкасте
События
• Frontend Mix
• Я.Субботник
• Frontend Union Conf
• FrontTalks
• Календарь WSD
Новости браузеров
• Safari Technology Preview Release 8
• Servo Nightly Builds Available
• Псевдокласс focus-within
Цвета в вебе
• Improving Color on the Web
• CSS Color Module Level 4
• Свойство currentcolor
• Disable #RRGGBBAA and #RGBA color values due to compat issues
Практика
• Относитесь к сеткам (на флексбоксах) проще
• Susy
• Lost Grid
• Unlabelled search fields
• Creating a custom input cursor/caret
• Не проверив HTML5-кода, не суйся в воду
• Invisible Content Just for Screen Reader Users
• html-tree
Портфолио
О подкасте
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:02:27 HTML 5.1
00:07:57 Откопали Dreamweaver
00:16:19 Гудини заработал
00:21:10 Ссылки и безопасность
00:37:01 Наставничество
События
• OdessaJS 2—3 июля
• FrontTalks 17—18 сентября
• JSconf EU и CSSconf EU 5—7 мая 2017
• Frontend Mix 7 июля
• Яндекс.Субботник 9 июля
HTML 5.1
• HTML5.0 уходит в прошлое
• Multirange
Откопали Dreamweaver
• Dreamweaver is back for us, coders
• Блог Brackets
Гудини заработал
Ссылки и безопасность
• About rel=noopener
• Everything about controlling the Referer header
• Джереми Кит на HTML Special
• Things to Know with Third-Party Scripts
Наставничество
• Алёна Батицкая на PiterCSS №5
• Путь наставника
• Алексей Рыбаков, он же Flack
• Пособие для новичков Стаса Мельникова
Ведущие: Вадим Макеев, Алексей Симоненко, Андрей Сумин
Темы
00:00:00 Интро
00:00:13 События
00:09:03 Samsung купила Joyent
00:13:39 Element Queries
00:17:30 React в Mail.Ru
00:25:31 Стандарты и семантика
00:45:51 Собеседования и новички
00:57:54 Как верстальщику стать замтехдира
События
• WSD в Екатеринбурге
• Видео с WSD
• Круглый стол на саммите PWA и другие видео
• The Progress of Web Apps (Edge)
• MoscowJS №31
• OdessaJS
• Билеты на Frontend Union Conf
• Видео с Frontend Union Conf 2015
Samsung купила Joyent
• Samsung acquires Joyent
• Node.js Foundation
Element Queries
• EQCSS
• Container Queries: Once More Unto the Breach
React в Mail.Ru
• Facebook Messenger
• Про Messenger на JSConf в Берлине
• Константин Лебедев на Фейсбуке
• Андрей Сумин в Фейсбуке
• Новый фронтенд Tinkoff.ru: Fluxible + React
Стандарты и семантика
• Насколько строго вы следуете стандартам и лучшим практикам на фронтенде
• Документация по y5
• The web platforms, plural, PPK
Собеседования и новички
• Что ожидать на собеседовании на HTML-верстальщика или JS-программиста
Как верстальщику стать замтехдира
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:06:49 Шрифты
00:13:39 Практика
00:37:44 Новинки Safari
События
• HTML Special и CSS Day
• Лог с HTML Special
• Лог с CSS Day
• Саммит по PWA
• PiterCSS №5
• Видео с PiterCSS
Шрифты
• Google Fonts
• Паттерны загрузки веб-шрифтов
Практика
• Что должен знать HTML-верстальщик?
• Improving CSS quality at Facebook and beyond
• Как во флексбоксе работают z-index и автоотступы
• New CSS Flexbox behavior for absolute-positioned children
• Pixel Density, Demystified
• Anchors vs Buttons
Новинки Safari
• Safari 10.0
• Apple Pay JS
• Apple Pay on the Web
• Видео сессии про Apple Pay с WWDC
Ведущие: Дмитрий Барановский, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:06:10 Релизы недели
00:17:06 Практический CSS
00:23:01 Типографика на SVG
00:25:38 Чёртов открытый веб
00:39:49 Как дела в Adobe
События
• PiterCSS №5 17 июня
• WSD в Екатеринбурге
• HTML Special и CSS Day
• Progressive Web App Dev Summit
• OdessaJS
• Web Directions
• JSConf AU
• CSSConf AU
Релизы недели
• Firefox 47
• WebExtensions API
• Announcing LastPass for Microsoft Edge
• What’s new in Chromium 51 and Opera 38
• Presentation API
• jQuery 3.0
Практический CSS
• Avoid Overstyling Base Styles
• CSS at BBC Sport
• Do websites need to look exactly the same in every browser?
Типографика на SVG
Чёртов открытый веб
• The Fucking Open Web
• PWA Discovery: You Ain’t Seen Nothin Yet
Как дела в Adobe
• Dmitry Baranovskiy’s Web Log
• Эдоуби
• Snap.svg
• Raphaël
• Adobe Experience Design (XD)
• Sketch
• Creative Cloud Extract (Project Parfait)
• SVGO Compressor для Sketch
• SVGO Exporter for Adobe Illustrator
• SVGO
• Avocode
• Webflow
• Brackets
• Adobe Web Platform
• CSS Regions
• Snap.svg Animator для Adobe Flash
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:06:40 Семантика CSS и HTML
00:22:00 Содержимое в CSS
00:31:46 Полезное для SVG
00:38:46 Веб и приложения
События
• HolyJS
• Антихайп, Андрей Листочкин
• Лог со ScotlandCSS
• Лог со ScotlandJS №1
• Лог со ScotlandJS №2
• HTML Special и CSS Day
• WSD в Екатеринбурге
Семантика CSS и HTML
• Семантический CSS
• Понимание семантики
• Слова в CSS-классах
• Managing CSS Projects with ITCSS
• BEML
Содержимое в CSS
• CSS Generated Content
• Модуль генерируемого контента CSS3 обновился спустя 13 лет
Полезное для SVG
• SVG Crowbar
• SVGO compression
Веб и приложения
• State of the gap
• Регрессивные веб-приложения
• Instant Articles
• Why is Instagram not a website (yet)?
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:34 Статьи для новичков
00:06:38 Reset против Normalize
00:13:29 JS для начинающих
00:15:33 Дилетанты и профессионалы
00:25:20 Зачем разбираться в SVG
00:29:25 Атомарный CSS
00:37:45 Программирование на CSS
00:49:60 Сервис-воркеры в Safari
События
• Frontend Conf
• ScotlandJS
• ScotlandCSS
• HolyJS 5 июня
• Встреча с докладчиками
• Fronteers
Статьи для новичков
• От нуля до героя фронтенда, часть 2
• Хорошие и плохие CSS-практики для начинающих
• Михаил Дубаков
• Бесплатный курс Академии по SVG
Reset против Normalize
• Reset.css
• Normalize.css
• Sublime Autoprefixer
• Atom Autoprefixer
JS для начинающих
Дилетанты и профессионалы
• jQuery и Bootstrap: расставляем точки над «i»
• Мобильный Твиттер
• UnCSS
Зачем разбираться в SVG
• Бесплатный курс Академии по SVG
Атомарный CSS
• Universal.css
• OrnaJS
• Cutestrap
• Flex Layout Attribute
• Material Design Lite
Программирование на CSS
Сервис-воркеры в Safari
• Safari TP5
• Service Workers 101
• Сервис-воркеры в Edge
• Джейк Арчибальд
• Тимоти Хэтчер
• Bringing seamless checkouts to the mobile web
• Payment Request API
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:04:01 Семантика и БЭМ
00:29:40 CSS для новичков
00:32:09 Контроль версий и клиенты
00:45:51 JS-модули в Edge!
00:51:42 Google I/O
События
• PiterCSS №4 24 мая
• WSD в Екатеринбурге 25 июня
• Frontend Union Conf в Вильнюсе 27 августа
• HolyJS 5 июня
Семантика и БЭМ
• Осмысленный CSS: описывайте стилями свою логику
• Бэмантика: пишите осмысленные стили без повторов
• More Meaningful CSS
• Семантика или смерть
• MIND, библиотека доступных элементов интерфейса eBay
CSS для новичков
Контроль версий и клиенты
• GitKraken
• Tower
• GitHub Desktop
• GitBox
• GitUp
• Термины Гита и Гитхаба
JS-модули в Edge!
• Previewing ES6 Modules and more from ES2015, ES2016 and beyond
• ES-модули в Firefox
Google I/O
• Страница события
• Веб и Chrome на Google I/O
• Autofill: What web devs should know, but don’t
• Progressive Web Apps
• Accelerated Mobile Pages
• Комикс xkcd
Ведущие: Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События
00:03:39 Как браузеры экономят батарейку
00:16:50 Оптимизация графики
00:33:44 Прозрачность в HEX-цветах
00:43:06 !important можно, если нужно
00:48:27 Фантомные страхи и адаптивные таблицы
00:52:06 Полифил через юзер-агент
События
• Лог трансляции с CSSConf в Будапеште
• WSD в Екатеринбурге 25 июня
• FrontendFellows в Перми 27 мая
• FrontendFellows в Астане 29 июля
• Rolling Scopes Summer Summit в Минске 4 июня
• Видео с PiterCSS №3
Как браузеры экономят батарейку
• Introducing power saving mode in Opera
Оптимизация графики
• Reducing JPG File size
• ImageAlpha
• Can I Use: WebP
• APNG
• MozJPEG
Прозрачность в HEX-цветах
• RGBA и RRGGBBAA в Firefox 49
• Color in Opera 10 — HSL, RGB and Alpha Transparency
!important можно, если нужно
• The Importance of !important: Forcing Immutability in CSS
• Likely
Фантомные страхи и адаптивные таблицы
• CSS only Responsive Tables
• Accessible, Simple, Responsive Tables
Полифил через юзер-агент
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:15 События
00:09:33 Новинки Chrome и Opera
00:15:02 Блокировщики рекламы это честно?
00:24:29 Pointer Events в Chrome
00:33:40 Ещё раз про гриды
00:36:14 Универсальные расширения
00:42:34 Веб-компоненты ещё живы?
00:55:35 CSS-модули «ни о чём»
События
• Webdev Talks&Works
• СПЕЦИА
• Frontend Conf
• CSSconf Nordic
• Web Rebels
• ScotlandCSS
• ScotlandJS
• HolyJS
• HTML Special и CSS Day
• CSSconf Budapest
• JSConf Budapest
• PWA Dev Summit
• Текстовые трансляции
• Архив трансляций
Новинки Chrome и Opera
• What’s new in Chromium 50 and Opera 37
Блокировщики рекламы это честно?
• Native ad blocker and video pop out ready in Opera
• Free ad blocker right in new Opera Mini for Android
Pointer Events в Chrome
• Chrome Status: Pointer Events
• «Карточный домик» Романа Дворнова
• Apple Meta Viewport
• W3C Touch Events
• Шутка про IE6 или ES6
Ещё раз про гриды
• Гриды в WebKit без префиксов
• Можно вообще всё. Раскладка по гриду
• OdessaJS 2016
Универсальные расширения
• WebExtensions in Firefox 48
• For a Better Extensions Ecosystem
• Core API Proposal
Веб-компоненты ещё живы?
• Web Components and Model Driven Views, Alex Russell
• Polymer
• Are We Componentized Yet?
• How GitHub is using Web Components in production
CSS-модули «ни о чём»
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:27 Node.js 6
00:23:26 Новые методы DOM
00:24:56 Иконки, графика и чистый CSS
00:40:37 Жизнь и смерть в опенсорсе
00:45:42 Эксперименты и префиксы
00:49:49 Firefox как новый IE, в хорошем смысле
События
• PiterCSS №3
• Frontflip
• Текстовые трансляции
• FrontendConf в Москве 30—31 мая и 1 июня
• HolyJS в Питере 5 июня
• Видео с FrontTalks
Node.js 6
• Node v6.0.0
• Node.js ES2015 Support
• ES6 in Node v6
• Chrome Canary 100% ES6
• ES6, ES7, and beyond
Новые методы DOM
• Методы DOM prepend, append, before, after и replaceWith
Иконки, графика и чистый CSS
• Making the Switch Away from Icon Fonts to SVG: Converting Font Icons to SVG
• Working with Images in Stylesheets with PostCSS
• Why I don’t use CSS preprocessors
• Borschik
Жизнь и смерть в опенсорсе
• Is CSScomb.js dead?
• CSScomb: Sorting CSS Properties, The Better Way
Эксперименты и префиксы
• Updating Our Prefixing Policy
• Префиксы. Зачем и как правильно
Firefox как новый IE, в хорошем смысле
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:57 Браузерные новости
00:14:18 Методологии CSS
00:21:15 Stylelint и CSSX
00:36:41 Параллакс
00:43:05 Booking сделал PWA
00:44:02 Доступное содержимое
00:55:13 Что слушаете?
События
• Стачка в Ульяновске
• PiterCSS №3 26 апреля
• MoscowJS 28 апреля
• HolyJS в Питере 5 июня
Браузерные новости
• Project SpiderNode
• Embed Everything!
• Free VPN integrated in Opera for better online privacy
• Opera is doubling the server capacity after the built-in VPN launch
Методологии CSS
• MaintainableCSS
• Микрометодология вёрстки OPOR
Stylelint и CSSX
• Stylelint
• CSSComb
• Finally, CSS In JavaScript! Meet CSSX
• На освоение React мне потребовалась всего неделя, а чем вы хуже?
Параллакс
Booking сделал PWA
• Progressive Web Apps with Service Workers
Доступное содержимое
• Aesthetics of the invisible
• Thus Spoke HTML
• ARIA, Accessibility APIs and coding like you give a damn!
Что слушаете?
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:02:17 Регрессионное тестирование
00:07:38 Фолбэк для флекса
00:14:18 Директива @apply, миксины в CSS
00:26:30 Прогрессивные веб-приложения
00:44:25 Версии CSS
00:51:15 Кому нужна семантика?
События
• Прошла FDConf в Минске
• Стачка в Ульяновске 22—23 апреля
• PiterCSS №3 26 апреля
• MoscowJS 28 апреля
• Frontend Party в Питере 29 апреля
• HolyJS в Питере 5 июня
Регрессионное тестирование
• Автоматизация регрессионного тестирования CSS
• Doing nothing for visual regression testing
Фолбэк для флекса
• Почти полное руководство по флексбоксу без самого флексбокса
• Инлайновый контекст форматирования
• Мечты и реальность. Прощай CSS3, здравствуй IE6
Директива @apply, миксины в CSS
• CSS @apply Rule, спека
• postcss-apply
• cssnext
• CSS @apply rule (native CSS mixins)
Прогрессивные веб-приложения
• PWA Rocks
• PWA List на Гитхабе
• Web App Manifest
• Service Workers replacing AppCache: a sledgehammer to crack a nut
• CSS Houdini
Версии CSS
Кому нужна семантика?
Ведущие: Вадим Макеев, Олег Мохов, Алексей Симоненко
Темы
00:00:00 Интро
00:00:30 События
00:01:10 Как сделать конференцию
00:18:09 Путь разработчика
00:26:23 Релизы CSSO 2.0 и Grunt 1.0
00:30:30 Анонсы с Веб-саммита Edge
00:38:46 Экспериментальный браузер Tofino
00:39:32 Эмоджи, нет, эмодзи
События
• SPB Frontend №13
• Frontend Party
Как сделать конференцию
• Доклад Олега с Субботника
• DUMP
• FrontTalks
• Fronteers
• OrenJS
• FrontendFellows
Путь разработчика
• Frontend Dev: хороший, плохой, злой
Релизы CSSO 2.0 и Grunt 1.0
• 2.0.0 Drop legacy API and new AST format
• Grunt 1.0.0 Released
Анонсы с Веб-саммита Edge
• My Top Takeaways From the 2016 Edge Web Summit
• EdgeHTML issue tracker
• Global CSS Property Usage
• API Catalog
• Microsoft Edge Web Summit 2016
Экспериментальный браузер Tofino
• Browsers, Innovators Dilemma, and Project Tofino
Эмоджи, нет, эмодзи
• Emoji: how do you get from U+1F355 to …?
• Investigating the Potential for Miscommunication Using Emoji
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:12 События
00:01:30 Bash на Windows
00:08:15 Новая тестовая сборка Safari
00:17:00 Оценка задач фронтендера
00:31:49 Определение тормозов на лету
00:36:41 Селекторы для системных элементов
00:39:25 Нужны ли препроцессоры
00:47:11 Что появится в ES2016
00:52:40 Новости про новости
События
Bash на Windows
• Running Bash on Ubuntu on Windows!
• The Ubuntu Userspace for Windows Developers
Новая тестовая сборка Safari
• Introducing Safari Technology Preview
• Add WebKit prefixes for Grid Layout
Оценка задач фронтендера
• Перевод
Определение тормозов на лету
• Performance measurements through requestAnimationFrame
Селекторы для системных элементов
• Styling native components, a proposal
Нужны ли препроцессоры
• Why I don’t use CSS preprocessors
Что появится в ES2016
• Список того, что появится в ES2016
Новости про новости
Ведущие: Вадим Макеев, Алексей Симоненко, Андрей Ситник
Темы
00:00:00 Интро
00:00:09 Андрей Ситник
00:00:20 События
00:00:27 Кто же новый IE?
00:11:33 Npm-гейт
00:27:49 Проблемы npm
00:33:25 «Мой» опенсорс
00:39:05 Агрессивный маркетинг PostCSS
01:01:51 Сахарный CSS
01:04:51 Это была шутка!
Андрей Ситник
События
Кто же новый IE?
• Apple is bad news for the future of the Web
• Никита Васильев
• The Chrome Distortion: how Chrome negatively alters our expectations
Npm-гейт
• I’ve Just Liberated My Modules
• A discussion about the breaking of the Internet
• Kik, left-pad, and npm
• Пакет left-pad
• How to not break the internet with this one weird trick
Проблемы npm
• Using Release It!
• Массив files в package.json
«Мой» опенсорс
• There is no “my” in open source
Агрессивный маркетинг PostCSS
• #СитникХватит
• postcss-sorting
• stylelint
• Modular CSS preprocessing with rework
• rtlcss
• uncss
• postcss-inline-svg
• cssnext
• precss
• postcss-import
• postcss-easy-import
Сахарный CSS
• SugarSS
Это была шутка!
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:21 События
00:02:10 Единицы измерения шрифта
00:18:07 Инлайнить ли шрифты
00:23:19 Новинки браузеров
00:36:36 Голый CSS на отступах
00:42:10 Лево и право для CSS-свойств
00:45:00 Критика React
00:55:36 Опрос Stack Overflow
События
• PiterCSS
• CodeFest
• Видео с WSD
• WSD в Питере
Единицы измерения шрифта
• Адаптивная типографика на единицах вьюпорта
• Что использовать в медиавыражениях: пиксели, емы, ремы?
• Сайт Dev.Opera
• Sass MQ
• Миксин ремы-пиксели
Инлайнить ли шрифты
• Антипаттерн для веб-шрифтов: Data URI
• Homebrew web font tools
Новинки браузеров
• Новинки Chrome 49 и Opera 36
• Поддержка расширений в тестовой версии Edge
• Обзор новинок Firefox Developer 47
• Браузерный движок нового поколения Servo
• Browser HTML
Голый CSS на отступах
• SugarSS
• За что я люблю CoffeeScript
• Emmet
• Hayaku
• CSSComb
Лево и право для CSS-свойств
• Флексбокс вполне логичен
• postcss-bidirection
• RTLCSS
Критика React
• На освоение React мне потребовалась всего неделя
• Polymer
• Презентация на React
• Сайт PostCSS
Опрос Stack Overflow
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:18 События
00:01:58 Кризис ожирения сайтов
00:07:47 Реклама
00:30:39 Новинки браузеров
00:35:16 Background Sync
00:36:45 Статус Grid Layout в Blink
00:38:57 Любовное письмо к jQuery
00:42:02 Давайте полегче с JavaScript
00:48:32 HTML: что дальше?
00:51:20 Оформление поломанных картинок
00:55:42 WTF Opera Mini?!
00:56:48 Полифил для object-fit на SVG
00:58:11 Зовём Андрея Ситника
События
• День рождения SPB Frontend
• OdessaJS
• Текстовые трансляции с конференций, дополнение к @webstandards_ru
• Логи трансляций
Кризис ожирения сайтов
Реклама
• Вышел браузер Opera со встроенным блокировщиком рекламы
• A Never-Ending Story On Ad-Blockers
Новинки браузеров
Background Sync
Статус Grid Layout в Blink
• CSS Grid Layout. Current Status and Future Plans
Любовное письмо к jQuery
Давайте полегче с JavaScript
• Maybe we could tone down the JavaScript
HTML, что дальше?
Оформление поломанных картинок
• Styling Broken Images
• Generated and Replaced Content
• Pseudo-Elements
WTF Opera Mini?!
Полифил для object-fit на SVG
Зовём Андрея Ситника
Ведущие: Вадим Макеев, Слава Олиянчук, Алексей Симоненко
Темы
00:00:00 Интро
00:00:53 События
00:01:02 Флексбокс — кандидат в рекомендации
00:06:19 Определение article
00:09:12 Висячая пунктуация
00:13:47 Обновился CSSO
00:18:37 Быстродействие
00:26:17 HTTP/2
00:32:37 Блютус в вебе
00:34:18 Про SVG по-русски
00:37:26 БЭМ и шаблонизация
00:48:22 Шаблонизатор BEM-XJST
01:00:20 Завершение: ваши предложения
События
• PiterCSS №2 22 марта
Флексбокс — кандидат в рекомендации
• Флексбоксы готовы!
• Полифил Flexibility
• Будущее механизмов раскладки
Определение article
• Rewrite of the article element definition
Висячая пунктуация
• Висячая пунктуация в WebKit
• Gosh Hang It!
• Типограф Муравьёва
Обновился CSSO
Быстродействие
• Preload: What Is It Good For?
HTTP/2
• HTTP/2: готовимся к переходу
• Не гзипом единым, видео с Я.Субботника
• Твиттер Frontend Performance
Блютус в вебе
• An introduction to the Web Bluetooth API
Про SVG по-русски
• SVG в вебе. Практическое руководство
БЭМ и шаблонизация
Про шаблонизатор BEM-XJST
• Видео доклада про BEM-XJST
• Репозиторий проекта
Завершение: ваши предложения
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:17 События
00:03:25 SVG и GitHub без иконочных шрифтов
00:09:52 Google Resizer
00:10:46 Переводы CSS-live
00:15:10 Sass и ES2015
00:18:50 CSS Snap Size
00:20:35 Селектор :root
00:24:36 Типографика
00:41:43 Завершение: ваши вопросы
События
• SPB Frontend
• Видео с SPB Frontend
• Я.Субботник по фронтенду
• Лог текстовой трансляции с Яндекс.Субботника
• PiterCSS №2
• CodeFest 2016
• DUMP 2016
• Стачка 2016
SVG и GitHub без иконочных шрифтов
• Delivering Octicons with SVG
• Что случается с SVG-иконками, вставленными через use
Google Resizer
Переводы CSS Live
• Свойство background-clip и его применения
• Краткий обзор object-fit и object-position
Знаете Sass? Значит знаете и ES2015!
• You Know Sass, You Know ES2015
CSS Snap Size
• CSS Snap Size, черновик спецификации для вертикального ритма со свойством snap-height
Про селектор :root
Типографика
• The New Web Typography
• Основы стиля в типографике
Завершение: ваши вопросы
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:13 События
00:01:37 Редакторы и плагины
00:12:01 Разработка на мобильных
00:22:45 Вёрстка писем
00:34:16 CSS-переменные
00:47:20 Альтернативная подгрузка стилей
00:52:15 Примеры использования calc()
События
• The Rolling Scopes Conference
• Видео с The Rolling Scopes Conference
• MoscowJS
• Я.Субботник по фронтенду
• PiterCSS
Редакторы и плагины
• Используем VS Code для Веб-разработки
• Why I love Visual Studio Code for CSS / HTML development
• Hayaku
• CSSComb
Разработка на мобильных
• Prompt 2
Вёрстка писем
• Using Flexbox in an Email
• The Fab Four technique to create Responsive Emails without Media Queries
• Punched card coding
CSS-переменные
• Theme switcher using CSS custom properties
• Почему я в восторге от «родных» CSS-переменных
• Tab Atkins, The Future of CSS
Альтернативная подгрузка стилей
• Control CSS loading with custom properties
• Управление загрузкой CSS с помощью пользовательских свойств
Примеры использования calc()
Ведущие: Вадим Макеев, Андрей Саломатин, Алексей Симоненко
Темы
00:00:00 Интро
00:00:25 События
00:05:52 Обновился Grunt
00:17:07 Увлечение npm-скриптами
00:20:18 Особенности const и let из ES6
00:33:18 Как дела у Гитхаба
00:42:07 Подкасты
События
• PiterCSS №1
• Frontend Union Conf 2016
Обновился Grunt
Увлечение npm-скриптами
• Advanced front-end automation with npm scripts
Особенности const и let из ES6
• For and against let
• ES6 const is not about immutability
Как дела у Гитхаба
Подкасты
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:28 События
00:05:42 БЭМ
00:14:46 Gulp
00:19:56 Раскладки: флексы, гриды
00:28:44 Планы Edge на год
00:33:19 Firefox OS всё
События
• PiterCSS №1
• Frontend Conf
• Яндекс.Субботник
БЭМ
• БЭМ-методология: с чего всё начиналось и зачем это всё нужно
• Видео «БЭМ — норм»
Gulp
• Скринкаст по Gulp Ильи Кантора
• Скринкаст по Webpack Ильи Кантора
• run-sequence
Раскладки: флексы, гриды
• Learn CSS Layout
• Grid Layout
Планы Edge на год
• Looking ahead: Microsoft Edge for developers in 2016
Firefox OS всё
• Mozilla to end development for Firefox OS on smartphones in IoT shift
Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко
Темы
00:00:00 Интро
00:00:45 Новинки браузеров
00:07:42 PhantomJS 2.1
00:10:16 Переменные в CSS
00:19:43 Sass с PostCSS
00:24:37 Загрузка шрифтов
00:32:36 Спрайты
00:36:25 Адаптивные картинки
00:38:01 HTTPS
00:43:38 Парадоксы HTML и CSS
00:47:18 Коты JS-фреймворки
Новинки браузеров
PhantomJS 2.1
Переменные в CSS
• Переменные как основа архитектуры CSS при работе с препроцессорами
Sass с PostCSS
Загрузка шрифтов
• Минимально необходимые шрифты
Спрайты
• A Gulp-Based External SVG Symbol Sprite Icon System
Адаптивные картинки
• Responsive Image Breakpoints Generator
HTTPS
• Почему до сих пор повсеместно не используется HTTPS?
Парадоксы HTML и CSS
Коты JS-фреймворки
En liten tjänst av I'm With Friends. Finns även på engelska.