Книга Chibi Vue от разработчика Yoichi Kikuchi - подробное руководство по внутреннему устройству Vue 3. Полезно для разработчиков, углублённо изучающих Vue.

В ней есть:

- Анализ ядра Vue: реактивность, компилятор шаблонов, система рендеринга.
- Практическая реализация упрощённой версии Vue с нуля.

Книга на английском языке.

#learning #chibivue #vuejs

Есть сайты, у которых нельзя открыть браузерные devtools

Делается это так:

Запрет на меню и хоткеи

document.addEventListener('contextmenu', event => event.preventDefault());

document.addEventListener('keydown', event => {
    if (event.key === 'F12' || (event.ctrlKey && event.shiftKey && event.key === 'I')) {
        event.preventDefault();
    }
});

Определять открытие девтулз и, например, перегружать страницу:

(function() {
    const element = new Image();
    Object.defineProperty(element, 'id', {
        get: function() {
            throw new Error('DevTools detected!');
        }
    });
    console.log(element);
})();

#badpractice #devtools

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

А стремиться к цели - так

#offtop #video #motivation #animals

Очередной бессмысленный и беспощадный лонгрид: React vs Vue – подробное сравнение и перспективы

Комментировать не буду

#react #article

В последних версиях Vite активно доделывают поддержку lightningcss

Сейчас для процессинга CSS используется ESBuild, но с переходом на Rolldown нужно что-то другое.
Экспериментально lightningcss был в Vite с 4 версии.

#vite #css

Поздравляем Деми Мурыча с очередным взятым на выходных рубежом в форме Дня рождения и предлагаем широкой публике его мысли о TypeScript

#murych #audio #typescript

А что вы используете для составления презентаций?

После долгих поисков остановился на Marp
Содержание презентации находится в markdown, затем преобразуется в html, и потом в pdf

Из удобного:

1. Прост как валенок и проверен временем
2. Текст и оформление можно сгенерить AI и затем кастомизировать вручную
3. Каждый слайд держу отдельным файлом и собираю их скриптом - для разных презентаций свои слайды
4. Из-за перевода в html можно очень сильно кастомизировать любой слайд через CSS класс на этом слайде
5. Плагин для VS Code - сразу видно превью, и есть генерация по команде/кнопке

#presentation #markdown

:hover > :not(:hover)

hover обычно используется, чтобы выделить какой-то элемент. Но иногда красивей что-то сделать с остальными

ul {
  @media (hover) and (prefers-reduced-motion: no-preference) {
    & > li {
      transform-origin: left center;
      transition: transform 1s var(--ease-spring-3), opacity 0.3s var(--ease-3);
    }

    &:hover > li:not(:hover) {
      opacity: 0.25;
      transform: scale(0.8);
    }
  }
}

#css #tip

В GitLab-e уже тестируют rolldown-vite

Скорость сборки примерно в 5 раз быстрей, и значительно меньше потребление памяти

#gitlab #rolldown #vite

У меня Cursor - девочка (безо всяких системных промптов)

#ai

За победу Аргуса на Product Radar одним из призов идет кредит на облачные сервисы Yandex на 400 т.р. Правда там куча условий неудобных, типа, юрлица и срок в 6 месяцев, так что полезности в этом мало.

Кто-нибудь знает, как эффективно монетизировать это богатство?

Меня поддержали отсюда пять человека, одного знаю, других - нет. Напишите в лс, могу с каждым поделиться по 30К этих призрачных кредитов. У Яндекса вроде в Казахстане датацентр есть, так что с паршивой овцы хоть випиэнку можно сделать. Опять же, если активирую этот "приз".

#argus #yandex

Сегодня Симпсоны

#apple #offtop #video

Devin (тот самый "заменяла") ведет проект DeepWiki где описывает проекты по их репозиториям. Любит чертить диаграммы.

Вот дипвики Vue. Довольно интересно

#vuejs

На vue-faq.org я написал, что JS классы во Vue лучше не использовать. Это не совсем правильно. Не надо использовать классы с реактивными свойствами. Но если через классы создаются объекты без реактивности внутри, которые ты уже помещаешь в реактивные массивы - то вполне вариант.

Для диаграммы на картинке я попробовал сперва построить структуру объектов на TS, получилось громоздко и запутанно. Переделал на классы - стало намного читабельней и меньше кода. Ну и типизация настоящая (почти), а не эрзац. Так что теперь это основной вариант для сложных структур данных.

#oop #reactivity

Добавил в свою Noema возможность подписок - периодической рассылки сводок в определенный канал или группу

Так что если здесь что-то появится, не пугаемся

#noema #tg #ai