Душный Вуй
745 subscribers
151 photos
5 videos
4 files
351 links
Немного душные, но ламповые заметки о Vue.js
#vuejs #vue #nuxt #vuex #pinia #вью #vapor
Download Telegram
А ещё вот какое интересное, смотрим на конец жизни некоторых фреймворков (если он есть конечно)

https://endoflife.date/vue
#подкаст

Обзор State of Vue.js 2025, новый статус styled-components и обсуждение новостей JavaScript — уже через час.

Новый выпуск «Тяжелого утра» в 11:00:
на YouTube
в VK Видео
💥Встречаемся на HolyJS💥

7–8 апреля Мы - Msk Vue.JS будем на конференции HolyJS. Едем не только слушать доклады и окультуриваться, но и представлять наше сообщество!

Мы развернем на конференции свой стенд с активностями, в которых можно будет выиграть мерч и просто обсудить Вуячные и ДжаваСкриптовые тренды🙃

На Холи мы будем не одни, а целая выставка JS-сообществ.
С какими еще коммьюнити можно будет повзаимодействовать? Узнай на сайте HolyJS.

Кто тоже собирается на Холи? Давайте планировать встречу!
Please open Telegram to view this post
VIEW IN TELEGRAM
Новый ChatGPT великолепен)
createSharedComposable

Если бы меня спросили лучшие паттерны для освоения во Vue, я бы точно назвал одним из них shared composable. Почему и что это за фрукт такой?

Происхождение
Первое упоминание о shared composable было в RFC Vue посвященному Effect Scope. И там говорится о примере композабла useMouse который слушает перемещения мышки и возвращает это в виде реактивных переменных координат. И вроде логично, что это не самое легковесное действие. А если это нужно множеству компонентов? Да каждый компонент использующий useMouse подписывается на него и это становится уже ощутимо. Тогда почему бы просто не вынести в глобальный STM как Pinia? Отличный вариант, но он будет работать даже когда нет никого кому нужны эти данные. И вот тут на помощь приходит shared composable он умеет как STM шарить данные на множество инстансов, но при этом если никто его не использует, то "стор" уничтожается! При этом сам паттерн универсальный и все что вам нужно это обернуть обычный композабл в createSharedComposable. И да, как только все компоненты использующие useMouse будут размонтированы shared composable тоже отпишется от событий мышки.

Как это работает?

На самом деле весьма не хитрым образом. Оно использует API Effect Scope + счетчик подписчиков, когда подписчиков становится 0 он уничтожает текущий скоуп. Вот и все. А... возможно вам не совсем знакомо что же такое Effect Scope (однажды мой доклад на эту тему уже выложат на YouTube...). А вот поэтому этот паттерн и хорош, он заставляет вас слегка заглянуть поглубже в работу Vue. Я уже приложил ссылку на RFC, где крайне подробно расписано что такое реактивные скоупы и как они работают. Если совсем сократить и упростить, то эффект скоупы это как мешок для реактивности: он запоминает все вызванные watcher-ы и уничтожает их в нужный момент (да-да именно так работает setup в компонентах). А вместо onUnmounted вы можете использовать onScopeDispose.

А чем же так крут этот паттерн еще?
1. Учебный эффект позволяющий лучше понять работу Vue
2. Возможность оптимизации как в примере c useMouse
3. Он позволяет на SPA приложениях спокойно заменить Pinia или другой STM на себя, так как спокойно выполняет обязанности глобального стейт менеджера, только еще и умеет уничтожаться когда никому не нужен (с pinia я видел как люди вручную это дело пытаются зачищать)
4. Advanced DI. По сути созданный композабл это сервис который может жить внутри provide / inject и расшаривать данные и логику как STM, но только на определенной части приложения (я не раз видело как пытаются генерировать это с pinia + id стора)

А какие есть минусы?
- Это не самое SSR Friendly решение
- Этого API нет из коробки, поэтому вам придется либо писать его самим, либо взять из vueuse
- Можно при неаккуратном использовании натворить страшных вещей
- Алгоритм использует простой счетчик, поэтому циклическая зависимость приведет к невозможности уничтожения (если не создать ручной "рубильник")

Итого: классный паттерн имеющий крайне широкие возможности с дополнительным эффектом погружения в мир реактивности Vue, однозначно рекомендую к изучению
Кстати, кстати, кстати!
7-8 апреля будет HolyJS, и я там тоже буду с ребятами из MSK VUE.JS
Так что приходите, будем болтать, обсуждать вуй и душнить 😘💪
Please open Telegram to view this post
VIEW IN TELEGRAM
Тут короче сказали, мол, а мы и старого автора то не знали, капецъ

Надо исправлять, меня зовут Владимир Бандуристов, я тимлидю фронтенд/вуй в билайне и вот уже кажется 3 года веду этот канал, приятно познакомиться =)

Ещё я люблю ваху, у меня есть замечательная собака породы бордер-колли (кстати я написал базу данных этой породы https://bc-db.ru/) и огромное желание нести вуй в массы 💪
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
Шо, а вы юзаете ллмки для написания тестов?
👌1💯1