Жила-была мышка в домике. 

Скачет мимо лягушка - прыг-прыг! - спрашивает: 
- Кто, кто в домике живет? 
- Мышка - джейквишка. А ты кто? 
- А я лягушка - реактушка. Пусти и меня! 
- Иди. 

Вот их уже двое. Бежит зайчик. Подбежал к домику, спрашивает: 
- Кто, кто в домике живет? 
- Мышка - джейквишка, лягушка - реактушка. А ты кто? 
- А я зайчик - ангулярчик. Пустите и меня! 
- Иди. 

Вот их уже трое. Бежит лисичка: 
- Кто, кто в домике живет? 
- Мышка - джейквишка, лягушка - реактушка да зайчик - ангулярчик. А ты кто? 
-А я лисичка - астричка. Пустите и меня! 

Вот их уже четверо сидит. Глядь, бежит волчок - и тоже к домику, да и спрашивает: 
- Кто, кто в домике живет? 
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик да лисичка - астричка. А ты кто? 
- А я волчара - вьючара. Пустите и меня! 
- Ну иди! 

Влез и этот. Уже стало их пятеро. Откуда ни возьмись, бредет кабан: 
- Хро-хро-хро, кто в домике живет? 
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка да волчара - вьючара. А ты кто? 
- А я кабан - хатамахан. Пустите и меня! 
Вот беда, всем в домик охота. 
- Тебе и не влезть! 
- Как-нибудь влезу, пустите!
- Ну, что ж с тобой поделаешь, лезь! 

Влез и этот. Уже их шестеро. И так им тесно, что не повернуться! А тут затрещали сучья: вылезает медведь и тоже к домику подходит, ревет: 
- Кто, кто в домике живет? 
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка, волчара - вьючара да кабан - хатамахан. А ты кто? 
- Гу-гу-гу, вас тут многовато! А я медведюшка - денофрюшка. Пустите и меня! 
- Как же мы тебя пустим? Ведь и так тесно. 
- Да как-нибудь! 
- Ну уж иди, только с краешку! 

Влез и этот. Семеро стало, да так тесно, что домик того и гляди, разорвется.

А тем временем шёл Деми Мурыч по лесу. Смотрит - домик битком набитый. 
- Вы кто? - спрашивает. 
- Мы? Фронтендеры!!
- Идите в жопу, фронтендеры, - сказал Деми Мурыч и пошёл дальше.

#creative #literature #humor

DeepSeek R1 была доступна в Cursor AI уже 23 января, оказывается

Надо было в сеттингах просто включить

#ai #cursor

Идти по жизни надо так

#offtop #video #animals

Если показываете через <router-view> страницу с route параметром (продукты, каталоги, пользователей через id), и надо при смене параметра загружать нового, - то есть, следить за изменением параметра, то делать это можно двумя способами.

Через watch:

watch(
  () => props.id,
  async () => {
    userData.value = await fetchUser(to.params.id);
  },
  { immediate: true }
);

Через хук роутера onBeforeRouteUpdate:

js 
import { onBeforeRouteUpdate } from 'vue-router'

onBeforeRouteUpdate(async (to, from) => {
  if (to.params.id !== from.params.id) {
    userData.value = await fetchUser(to.params.id);
  }
})

Второй способ дает еще возможность использовать onBeforeRouteLeave, если вдруг надо

#router #tip

Написал статью "Обзор различных методов работы с реактивным стейтом во Vue"

Переделанная вот эта. Исправлены фундаментальные ошибки (автор не понимает, что такое composable функция) и некоторые другие недочеты

Внизу статьи опрос, просьба проголосовать.

Также размещено на Vue-FAQ

#reactivity #pinia #eventbus #article

Потестируйте и покритикуйте (UX, UI, функционал и др.) последний пет-проект

lissa-health.com

Позволяет держать в одном месте свою медицинскую информацию (лабораторные анализы, заключения, произвольные записи) и делать AI аналитику по ним

На сайте есть демо-видео
Также можно загрузить демо-данные

#lissa #pet

Есть строгие мальчики, есть ветренные девочки, и есть TypeScript - трансгендер с пронаунсом "AS"

#ts #lang

Если вы используете Google Analytics то Google Pagespeed часто ругается сам на себя - gtag.js размером в 100Кб+ снижает показатели сайта.

Можно сделать следующий финт:

 <script async src="https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4"></script>
 <script>
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());

   gtag('config', 'G-0SGZMMY7Y4');
</script>

меняете на

<script>
  window.addEventListener('load', function() {
    setTimeout(() => {
    var script = document.createElement('script');
    script.src = 'https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4';
    script.async = true;
    document.head.appendChild(script);

    window.dataLayer = window.dataLayer || [];
    function gtag(){ dataLayer.push(arguments); }
    gtag('js', new Date());
    gtag('config', 'G-0SGZMMY7Y4');
  }, 3000);
});
</script>
});

Ушедшие в первые 3 секунды посетители считаться не будут, но они, обычно, и не нужны.

#google #seo

Как отключить scroll страницы, когда показываешь модальный диалог через <dialog>?

body:has(dialog[open]) {
  overflow: hidden;
}

Размыть фон/overlay?

dialog::backdrop {
  backdrop-filter: blur(2px);
}

#css #tip #scroll

Пятничный оффтоп

Новые власти США рассекречивают документы вивесектария предыдущих правителей

Байденовская администрация в рамках DEI потратила $10 миллионов на создание и изучение трансгендерных мышей, крыс и обезьянок

В частности, $2.5 миллиона ушли на попытки забеременить трансгендерных мышей (отрезав им предварительно гениталии, что-то пересадив и накачав гормонами)

Содом и Гоморра. Помянем бедных испытуемых...

#offtop #pets

Rolldown-Vite готовится

Эван обещал в течение 2-3 месяцев

#rolldown #vite

Если делаете два близких приложения (например, клиентский фронтенд и админку) , и хотите расшарить какие-то компоненты и ресурсы, то есть несколько вариантов

1. Монорепозиторий. Оба проекта идут как пакеты и общие пакеты тоже отдельно. На любителя.

2. Выделить общее в отдельный NPM пакет и подключать его. Неудобно возиться с версиями и апдейтом.

3. Делать в одном проекте, настроить на две точки входа. Собирать Vite будет в одну кучу с двумя html файлами входа. Подразумевается, что так удобно работать на одном сайте с двумя мини-приложениями

4. Два отдельных vite.config.ts файла, два html, два App.vue и роутера. В package.json в скриптах прописываете свой Vite конфиг и копирование своего html в index.html. Запускается и собирается каждый как отдельный проект, в коде всё общее.

4. Git submodules. Отдельный проект подключается как поддиректория в твой (общие компоненты).

#tip

Написал статью про Model Context Protocol

Грубо говоря, это попытка выработать стандартный API для соединения LLM и инструментов - любых приложений, делающих что-то специфичное.

На двух последних проектах окунулся в работу с AI и эта штука (MCP) очень сильно может помочь в разработке приложений, использующих LLM. Чтобы не выклянчивать у чатбота что-то в диалоге, а использовать его для управления специализированными инструментами и получать на порядок более качественный результат.

#ai #article

Иногда придумывают действительно что-то полезное...

#gaming

Эван тут запустил опрос. Задумал, поди, бэкенд фреймворк написать от скуки.

Хочется сказать: Ю, ты, конечно, красавчек. Но, во-первых, js на бэке - это говно. Во-вторых, брать лучшие практики из Ларавеля, это как брать уроки танцев у стриптизерши из припортового бара. И, в-третьих, - дай нам Rolldown, Vapor и пофикси, наконец, этот гребаный Volar, а потом делай что хочешь.

P.S. Год назад на бэке отошел от любых фреймворков, абсолютно счастлив и жалею, что не сделал этого раньше

#backend #evanyou #laravel

В экспериментальных версиях браузеров уже появляется реализация Temporal - официальной замены Date в JavaScript

const dateTime = Temporal.Now.plainDateTimeISO();
console.log(dateTime); // e.g.: 2025-01-22T11:46:36.144

// 1851222399924 is our timestamp
const launch = Temporal.Instant.fromEpochMilliseconds(1851222399924);
const now = Temporal.Now.instant();
const duration = now.until(launch, { smallestUnit: "hour" });
console.log(`It will be ${duration.toLocaleString("en-US")} until the launch`);
// "It will be 31,600 hr until the launch" <- @js-temporal/polyfill
// "It will be PT31600H until the launch" <- Firefox Nightly

Уже доступен полифилл - @js-temporal/polyfill

#js #date