Как выжать из HTML/CSS динамику, или создание IRC клиента без JS

Когда возникает идея создать браузерный IRC-клиент без JavaScript, приходится сталкиваться с классической проблемой фронтенда: все насколько привыкли гнать динамику через JavaScript, что перестали замечать возможности HTML/CSS с щепоткой серверной магии по реализации многих фич. HTTP Streaming существует с давних времён, а CSS эволюционировал настолько, что может справиться с логикой состояний — но мы упорно продолжаем грузить мегабайты JavaScript (и иногда даже WebAssembly) для решений, которые вполне можно реализовать иначе. Идея создать IRC клиент без JavaScript не совсем нова (хоть это и выяснилось уже после создания такого :) ). Ещё в нулевых появился CGI:IRC — настоящий IRC клиент, который может работать полностью без JavaScript, позволяя людям общаться в реальном времени через браузер, даже если JavaScript по каким-то причинам не работал. Но это было в эру table-layouts, и когда CSS не был так развит, как сейчас. Сегодня возможностей больше, и мы воспользуемся ими, чтобы навернуть функциональность, которая не видана CGI:IRC. Результат можно глянуть (хоть и с дополнительной стилизацией и изменениями, которые не так важны для статьи) здесь , а ещё на GitHub

https://habr.com/ru/companies/timeweb/articles/1036526/

#declarative_shadow_dom #irc #nojs #html #css #httpstreaming #cssлогика #timeweb_статьи

Как выжать из HTML/CSS динамику, или создание IRC клиента без JS

Когда возникает идея создать браузерный IRC-клиент без JavaScript, приходится сталкиваться с классической проблемой фронтенда: все насколько привыкли гнать динамику через JavaScript, что перестали...

Хабр

Slider с использованием Web Components + Shadow Dom

Пишем Slider с Web Components В этой статье мы создали полнофункциональный слайдер, используя современные веб-стандарты. Мы не только реализовали базовую логику, но и освоили ключевые концепции: - Работу с Shadow DOM для изоляции стилей и структуры - Использование слотов для композиции контента - Реакцию на атрибуты для настройки поведения компонента - Организацию жизненного цикла через connectedCallback

https://habr.com/ru/articles/964180/

#Web_Components #Shadow_Dom #Declarative_Shadow_Dom

Slider с использованием Web Components + Shadow Dom

Продолжая тему из моей предыдущей статьи о веб-компонентах, я хочу подробнее рассмотреть их применение для решения реальных задач. Сегодня мы напишем простую, но полнофункциональную реализацию ...

Хабр