Что всё таки не так с веб компонентами

Господа, продолжаем разбиратся в тонкостях веб компонент. Сделал тут бенч - сравнениe фреймворков ( $mol/lit/symbiot ) по todomcv. Вроде говорим об одном, а бенч о другом, разве не так ? Ан-нет, что бы разобраться с веб компонентами нужны фреймворки которые ставят их во главу угла, те, кто "сделал на них ставку". Вот что мне удалось понять: Первое. Память: 124 байта на веб-компонент, и 16 байт на JS object. Разница на порядок, это много, и без виртуализации интерфейс скорее всего будет лагать Что не так то опять ?)

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

#shadow_dom #web_components #custom_elements #lit #symbiotejs #$mol

Что не так с веб-компонентами?

Если кратко - да все с ними ТАК . Это замечательный набор современных браузерных технологий, для решения реальных задач веб-разработки. Веб-компоненты позволяют делать очень многое, более просто и элегантно, чем это было бы без них. А главное, они позволяют, с потрясающей гибкостью, решать задачи “со звездочкой” - те, которые немного выходят за рамки и требуют более творческого подхода от разработчика. Почему-же тогда по Хабру гуляют, кхм… некие одиозные личности (не будем показывать пальцем) и рассказывают нам про то, что веб-компоненты это ужас-ужас и полный провал? Давайте разберемся.

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

#custom_elements #shadow_dom #symbiotejs #web_components #Lit

Что не так с веб-компонентами?

Здравствуйте, меня зовут Дмитрий Карловский, и я пилил веб-компоненты , когда их ещё не придумали, делал полноценные компоненты на AngularJS, когда там ещё были только директивы, и разработал компоненто-ориентированный фреймворк $mol с инверсией контроля и статической типизацией, когда это ещё не было мейнстримом. Короче, я немного в теме. И сейчас я расскажу вам, почему мы сразу отказались от Web Components и почему у них нет никаких перспектив. ✔ Готов получить сарказм

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

#shadow_dom #custom_elements #web_components

У Symbiote.js — серьезные проблемы

На днях, я опубликовал новость о выходе новой версии UI-библиотеки Symbiote.js, с обзором ее функций и необычной концепции. Я давно пишу на Хабре (и не только) о веб-компонентах и решениях на их основе, и знаю полный набор стандартных сомнений и возражений аудитории. Сегодня, я хотел бы познакомить вас с проблемами и компромиссами, на которые пришлось пойти, но уже от лица автора либы, человека, очень хорошо знающего, что там под капотом, то есть - меня самого.

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

#webcomponents #open_source #ssr #ssg #custom_elements #symbiotejs #shadow_dom #devrel #loose_coupling #architecture

Symbiote.js — изоморфные веб-компоненты (клиент + сервер)

Привет, Хабр! Меня зовут Алекс, и я мейнтейнер Symbiote.js - библиотеки для создания UI-компонентов и изоморфных приложений на самых современных веб-стандартах. Сегодня я расскажу про наше важное мажорное обновление - версию 3.x.

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

#webcomponents #ssr #symbiotejs #frontend #backend #изоморфизм #nodejs #custom_elements #shadow_dom #open_source

Вайбкодинг: как сгенерировать код расширения для визуализации ссылок в закладках браузера с помощью ИИ

Знакомо чувство, когда читаешь документацию, а через десяток страниц уже не помнишь, что именно успел изучить? Или когда возвращаешься к старой статье и не можешь понять — ты уже видел эту ссылку или нет? В эпоху информационного перегруза даже закладки перестают быть спасением — они просто копятся где‑то на панели, а на странице по‑прежнему нет никаких намёков, что ты здесь уже был. Но что если заставить браузер самому отмечать ссылки, которые у вас уже сохранены? Чтобы слева от каждой знакомой ссылки возникала метка с названием папки из закладок — как тихий намёк: «Ты это уже сохранял, не потеряй» . Сегодня мы не просто поговорим об идее — мы сгенерируем через нейросеть готовое расширение для Chrome, которое сделает это за нас. А заодно разберёмся, как такие инструменты создавать, тестировать и даже улучшать — шаг за шагом, от первого промпта до работающего прототипа. Пристегнитесь, будет интересно!

https://habr.com/ru/companies/bothub/articles/986406/

#вайбкодинг #расширения_для_браузеров #chrome #brave #javascript #shadow_dom

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

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

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

#Web_Components #Shadow_Dom #Declarative_Shadow_Dom

[Перевод] HTML мёртв, да здравствует HTML

Браузеры — это очень странный мир. Хотя WebAssembly добился успеха, в том числе и на серверах, клиент по-прежнему ощущается примерно таким же, как и десять лет назад . Энтузиасты будут говорить вам, что доступ к нативным веб-API через WASM — это решённая задача, достаточно лишь минимального клея JS . Но никто не задаёт вопрос, зачем нам вообще нужно получать доступ к DOM. Это лишь один из вариантов. В этой статье мне бы хотелось объяснить, почему уже настало время отправить DOM и всевозможные API на радугу, а также поделиться некоторыми идеями о том, как это сделать. Не буду притворяться, что знаю о браузерах всё. Сегодня уже никто не знает всего, в этом-то и проблема.

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

#accessibility #dom #shadow_dom #семантический_web

[Перевод] Веб-разработка на ванильном HTML, CSS и JavaScript: стилизация и сайты

Это вторая статья из цикла переводов о веб-разработке на чистых (ванильных) технологиях — без фреймворков и сторонних инструментов, только HTML, CSS и JavaScript. В первой части мы обсудили, почему такой подход может быть разумной альтернативой современным фреймворкам и рассмотрели использование веб-компонентов в качестве базовых строительных блоков для создания более сложных примитивов. В этот раз поговорим про стилизацию, а также деплой компонентов в продакшен без использования сборщиков, фреймворков или серверной логики.

https://habr.com/ru/companies/ruvds/articles/910734/

#ruvds_переводы #вебкомпоненты #custom_elements #shadow_dom #html_шаблон