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

Написал VitePress плагин для генерации диаграмм (Mermaid, PlantUML и других)

#vitepress #lib

Интересная опен-сорсная дизайн система для вдохновения

open-props

#css