Тред (Сергей Куликов)

Тема первого дня — кастомные элементы. Как в узком смысле (часть стандарта HTML), так и в широком (framework-agnostic подход к написанию компонентов и приложений на их основе).

Возможны, вы заметили, что до сих пор я избегал термина “веб-компоненты”. Думаю, тред на эту тему будет не лишним.

Тред о применении кастомных элементов в 2020. С момента релиза Firefox 63 прошло почти два года, в Safari поддержка появилась еще раньше. Так что уже можно делать некоторые выводы.

Первый тред на сегодня — о том, нужны ли кастомным элементам библиотеки и в каких случаях можно обойтись vanilla JS.

Тред про кастомные элементы без зависимостей, с примерами из личного опыта. И заодно немного о best practices.

Тред о кастомных элементах на TypeScript и тестировании.

Я обещал рассказать о не решенных проблемах кастомных элементов. В этом треде перечислю основные из них.

Сегодняшняя тема — Shadow DOM, его возможности и ограничения. Начнем с треда о главной проблеме, которую Shadow DOM призван решить: глобальный неймспейс и отсутствие в CSS изоляции.

Кроме изоляции стилей, Shadow DOM влияет и на то, каким образом они добавляются на страницу. Тред о том, что это значит на практике и каких улучшений стоит ждать в обозримом будущем.

Еще один важный аспект Shadow DOM — кастомизация стилей. При наличии изоляции это становится проблемой, поскольку некоторые стили надо переопределять. Небольшой тред на эту тему.

Тред про ограничения Shadow DOM и связанные с ними проблемы.

В завершение темы Shadow DOM — небольшой тред о слотах и композиции, которые я как-то обошел стороной.

Сегодня начнем с треда про элемент <template>. Раньше он считался частью веб-компонентов, хотя сейчас о нем вспоминают реже.

Тред о разработке на ES-модулях в браузерах.

Как и обещал, делюсь полезными материалами о веб-компонентах.