Vue-FAQ

Вчера команда Vite заопенсорсила Rolldown

Сейчас Vite под капотом использует два JavaScript сборщика - esbuild для dev режима и Rollup для билда. Первый - быстрый, но недостаточно функциональный, второй - функциональный, но медленный. Кроме того, они дают иногда несколько разные результаты.

Команда Vite пытается построить единый сборщик, одновременно и быстрый, и совместимый с системой плагинов Rollup. Для этого используются наработки OXC, где ресурсозатратный код Rollup переписывается на Rust для большей производительности.

Rolldown не готов для использования в продакшн.

#vite #rolldown #rollup #esbuild

Rolldown

Rolldown | Rust bundler for JavaScript

Fast Rust-based bundler for JavaScript with Rollup-compatible API

701 views09:29

Vue-FAQ

Stack Overflow Driven Development

(c) Grady Booch

#quote

480 viewsedited 06:34

Vue-FAQ

Авраам родил Исаака; Исаак родил Иакова; Иаков родил Иуду и братьев его...

Немного родословной языков программирования

#lang

494 views07:36

Vue-FAQ

Еще немного о языках программирования

Правительство США назвало и рекомендовало к использованию в госструктурах шесть memory safe языков программирования

#lang

450 views11:42

Vue-FAQ

23-24 марта 2024 будут очередные 48 часов бесплатного доступа к урокам VueSchool

Зарегистрироваться на них можно здесь

#vueschool #learning

vueschool.io

Vue School Free Weekend: 48 Hours of Unlimited Access

Sign up for Vue School's Free Weekend on Nov 2-3, 2024. Get unlimited access to 65+ premium Vue.js courses for 48 hours. Learn from industry experts!

959 views06:06

Vue-FAQ

Кроме Rolldown-a команда Vue на прошлой неделе выставила в open source еще один свой грандиозный проект - Vue Vapor, который уже можно попробовать в его песочнице.

Грандиозный потому, что это по сути переписывание бОльшей части фреймворка. При этом Vue API (код для Vue 3, который пишет разработчик) должен остаться тем же самым.

Современные фронтенд фреймворки бывают двух типов - runtime и compile time. Первые работают с Virtual DOM - это такая абстракция на JavaScript, с которой взаимодействует пользовательская программа вместо реального DOM вебстраницы и, грубо говоря, являющаяся его зеркальным отображением. Делается это потому, что работа с браузерным DOM (рендеринг) - очень затратная операция, и фреймворк через Virtual DOM призван её оптимизировать - например, несколько изменений в DOM собрать вместе и зарендерить как одно. Так работают Vue.js и React, они предоставляют в runtime браузера прослойку для пользовательского кода (типа виртуальной машины), который работает только с объектами Virtual DOM.

Compile time фреймворки вроде Solid.js или Svelte не создают этой прослойки, и компилируют пользовательский код в код, который работает с браузерным DOM напрямую. В результате бандл получается меньше, а программа - быстрее. Сложность тут в оптимизации подобной компиляции. Для простых вещей она подходит, но что-то более сложное - и сompile time фреймворки уже могут проигрывать в скорости, и однозначно проигрывают Vue 3 в DX.

Команда Vue хочет хотя бы частично попробовать внедрить compile time реактивность - можно будет указывать, какие пользовательские компоненты компилировать в конечный код (Vapor mode), а для каких использовать обычный Virtual DOM.

#vapor #solid #svelte #vuejs #react

GitHub

GitHub - vuejs/vue-vapor: Vue Vapor is a variant of Vue that offers rendering without the Virtual DOM.

Vue Vapor is a variant of Vue that offers rendering without the Virtual DOM. - vuejs/vue-vapor

535 viewsedited 14:33

Vue-FAQ

Если кто-то немного прифигел от числа контрибьютеров во Vue Vapor в новости выше (450 на данный момент), то данный твит Эвана всё разъясняет:

Совет: проведите spellcheck вашего репозитория, прежде чем опенсорсить его, чтобы избежать всех PR с исправлениями опечаток.

#tip

417 viewsedited 15:48

Vue-FAQ

Следующая большая Vue.js онлайн конференция пройдет 25-26 апреля 2024 года
Evan You заявлен спикером

Vue.js Live

#event #vuejs

Vuejslive

Vue.js Live 2024 Conference

Vue.js Live is a community conference taking place in a remote format. Meet best engineers to learn more about Vue.js fundamentals, best practices, and architecture. Join us on April 25-26, 2024.

413 views06:17

Vue-FAQ

Хм..
Почитал как работают Core Web Vitals и прозрачным прямоугольником на сплэш-скрине смог свести LCP до минимума (ранее был в районе 2 секунд)

Это этим занимаются SEO-специалисты?

#seo #webvitals

438 views08:49

Vue-FAQ

Кастомный обработчик ошибок:

try {
   // ...
} catch(e) {
   let url = `https://www.stackoverflow.com/search?q=[js] + ${e.message}`;
   window.open(url, "_blank");
}

#humor

855 views12:42

Vue-FAQ

Пример реализации светлой и темной тем на сайте на чистом CSS

<body>
  <label>
    <input id="dark" type="checkbox">
    Dark mode
  </label>
</body>

body {
  --fg: black;
  --bg: white;
  color: var(--fg);
  background-color: var(--bg);
}

body:has(#dark:checked) {
  --fg: white;
  --bg: black;
}

#css #tip

440 views06:07

Vue-FAQ

Решил применить плагин eslint-plugin-vuejs-accessibility на своем проекте онлайн магазина Arty-Crafty. По PageSpeed оценка по A11y была 72, теперь вот так. Мелочь, а приятно. БОльшую часть ошибок плагин помог исправить, остальное - по подсказкам PageSpeed.

Кстати, когда eslint-plugin-vuejs-accessibility показывает ошибку, по ссылке можно попасть на очень хорошее описание в документации плагина соответствующего требования A11y и варианты исправления, так что однозначно рекомендуется.

Чтобы подключить плагин в ESlint flat config (типа того, что используется в antfu eslint-config) нужен примерно такой код (в доке этого нет):

import a11y from "eslint-plugin-vuejs-accessibility";

export default antfu({
  plugins: {
    "vuejs-accessibility": a11y,
  },
  rules: {
    ...a11y.configs.recommended.rules,
    "no-console": "off",

#a11y #eslint #artycrafty

520 views09:14

Vue-FAQ

Полезный каталог Telegram групп по IT

@it_chats

#tip

408 views13:48

Vue-FAQ

Еще одна книжка с громким названием - Design patterns for Vue.js.

Автор - Lachlan Miller, член Vue team, контрибьютор во Vue.js, Vue Test Utils и Cypress

Платная, есть превью с двумя главами

#learning #book

885 views05:15

Vue-FAQ

С 1988 года 14 марта отмечается Международный день числа «Пи»
В 15 часов 9 минут 26 секунд

В связи с чем, один и тот же вопрос двум версиям ChatGPT - какая предпоследняя цифра в числе π?

#ai

555 views08:32

Vue-FAQ

Эван уже отписался по поводу нового AI Devin, который якобы решает 13% issues на GitHub

Devin не выходит за рамки того, что я себе представлял - и, честно говоря, он меня не впечатляет. Разработчик, который справляется со своими задачами лишь на 13%, - это обуза, а не актив.

Ну и надо заметить, что issues на GitHub бывают очень разные - и элементарные и хорошо сформулированные, и "туманные". Так же как и код, к которому они относятся.

#ai #evanyou

561 viewsedited 09:52

Vue-FAQ

Сегодня день искусственного интеллекта

Обновления у Codeium - бесплатного AI помощника в качестве расширения для IDE.

1. Появился Codeium University (кликнуть иконку "i" справа вверху боковой панели). Подробная информация как работать с инструментом в виде удобной справки

2. Появилась возможность добавлять свои файлы, директории и даже GitHub репозитории в контекст (вкладка Context). По-прежнему по репозиториям есть React и Svelte, но нет Vue ((. Можно скачать и добавить как локальную директорию. В принципе, можно наверно так найти несколько качественных проектов на Vue и добавить в контекст как эталон.

#codeium #ai

686 views11:27

About

Blog

Apps

Platform