Эффектная библиотека JavaScript для создания слайдеров с анимацией и эффектом параллакса.

> pnpm i smooothy

👉 Гайды по JavaScript | дать буст

Как работает система предзагрузки (Vue + Vite) 👀

🔸Определение компонента:
Мы используем defineAsyncComponent для создания компонента, который будет загружаться асинхронно. Это основа для разделения кода (code splitting) в Vue.

🔸Импорт-функции:
Мы отдельно определяем функции импорта (loadComponent и loadRoute), которые возвращают динамические импорты. Поскольку в Vite нельзя использовать "магические" комментарии Webpack, эти функции и выступают в роли механизма предзагрузки.

🔸Триггер-события:
Предзагрузка реализуется через событие @mouseenter. Когда пользователь наводит курсор на элемент, вызывается соответствующая функция импорта, и начинается загрузка кода.

🔸 Условный рендеринг:
Сам компонент отрисовывается только при необходимости (это управляется, например, через ref show), но благодаря предзагрузке код уже находится в памяти.

👉 Гайды по JavaScript | дать буст

Nuxt 4.0 официально вышел! Включает в себя ряд обновлений функций и небольшой список критичных изменений, о которых стоит знать.

Хотите подробный разбор с примерами кода по самым важным изменениям? Смотрите полный курс:
https://vueschool.io/courses/what-s-new-in-nuxt-4

Или быстрое видеообзор здесь:
https://youtu.be/wx5_FVjbC9c

👉 Гайды по JavaScript | дать буст

В версии Angular 20.2
🆕 Новая нативная анимация

👉 Гайды по JavaScript | дать буст

Лучшая альтернатива lodash

Библиотека утилит для JavaScript

✓ Без внешних зависимостей
✓ debounce, pick, chunk, cloneDeep, countBy...
✓ Оптимизирована для Node 18+ и современных браузеров

pnpm install es-toolkit

import { debounce, pick, chunk } from 'es-toolkit'

// 1. pick — выбирает конкретные свойства из объекта
const user = { name: 'Midu', email: 'midu@gmail.com', edad: 40 }
const profile = pick(user, ['name'])
console.log(profile) // { name: 'Midu' }

// 2. chunk — разбивает массив на группы
const nums = [1, 2, 3, 4, 5, 6, 7]
console.log(chunk(nums, 3))
// Результат: [[1, 2, 3], [4, 5, 6], [7]]

// 3. debounce — откладывает выполнение до завершения ввода
const debouncedSearch = debounce(query => {
  console.log('Поиск:', query)
}, 500) // задержка 0.5 с

const searchInput = document.getElementById('buscador')
searchInput.addEventListener('input', e => {
  debouncedSearch(e.target.value)
})

👉 Гайды по JavaScript | дать буст

Проверьте экземпляр FetchError в Nuxt для безопасной обработки ошибок в запросах на выборку

👉 Гайды по JavaScript | дать буст

Все еще пишете JavaScript сложным способом?
Вот решение, которое вы будете использовать всегда

👉 Гайды по JavaScript | дать буст

Совет по Javascript

Знаете ли вы об этом более простом способе получения/установки параметров запроса URL?

👉 Гайды по JavaScript | дать буст

5 БЕСПЛАТНЫХ инструментов для веб-разработчиков

http://warp.dev - Альтернатива Claude Code

http://sevalla.com - Full-stack хостинг и бесплатный статический сайт

http://usehooks.com - React hooks с примерами

http://ray.so - Создание изображений из фрагментов кода

http://sarthology.github.io/Animatopy - Анимационные сниппеты CSS

👉 Гайды по JavaScript | дать буст

Node.js v22.18.0 вышел

По умолчанию включена очистка типов

Теперь можно выполнять TypeScript-файлы без дополнительной настройки

$ echo 'const foo: string = "World"; console.log(`Hello ${foo}!`);' > file.ts
$ node file.ts
Hello World!

Фича экспериментальная. Отключается флагом --no-experimental-strip-types

👉 Гайды по JavaScript | дать буст

Трюк JavaScript: Используйте toSorted() для чистой, неизменяемой сортировки

👉 Гайды по JavaScript | дать буст

Преимущества использования useAsyncData вместо useFetch:

useAsyncData обладает рядом преимуществ с точки зрения производительности:

✓ Параллельные запросы: Позволяет загружать несколько источников данных одновременно, сокращая общее время загрузки.
✓ Улучшенная производительность: За счёт уменьшения времени ожидания данных приложение становится быстрее и отзывчивее.

👉 Гайды по JavaScript | дать буст

Совет по JavaScript

Необязательная цепочка с вызовами функций

👉 Гайды по JavaScript | дать буст

Совет дня:

Nitro — сервер, который используется в nuxt_js, — включает в себя очень мощную систему хранения данных.

Её можно настроить так, чтобы данные сохранялись:

🔸в файловой системе,
🔸в базе данных,
🔸в key-value хранилище

и во многих других источниках.

👉 Гайды по JavaScript | дать буст

Избегайте ошибок с помощью этих неизменяемых и современных методов массивов JavaScript!

Посмотрите их в действии

👉 Гайды по JavaScript | дать буст

Перестань использовать классовые компоненты в React.

Они сложные и неудобные в поддержке.

Функциональные компоненты — твои друзья.

Они проще, читаются легче и меньше нагружают мозг.

Можно сосредоточиться на разработке, а не на борьбе с управлением состоянием и методами жизненного цикла.

Единственный случай, когда стоит использовать классовые компоненты — это Error Boundaries.

👉 Гайды по JavaScript | дать буст

Эта библиотека JavaScript просто потрясающая

Она позволяет превращать элементы в перетаскиваемые коробки, обмениваясь позициями с другими элементами.

https://swapy.tahazsh.com/

👉 Гайды по JavaScript | дать буст