Знаешь, когда стоит использовать Vue.nextTick?

nextTick нужен в следующих случаях:

✅Когда нужно обратиться к обновлённым DOM-элементам сразу после изменения данных
✅Когда ты выполняешь операции, зависящие от нового состояния DOM
✅Когда нужно измерить размеры элемента после обновления (например, clientWidth, clientHeight)
✅Когда используешь сторонние библиотеки, которые напрямую работают с DOM (например, Chart.js)

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

Zod с .refine() = валидационные правила без лишней возни.

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

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

Но с serverless-архитектурой можно просто сосредоточиться на коде приложения.

В этом гайде POnukwili объясняет, как работает serverless, и показывает на практике, как опубликовать Docker-образ на Node.js в AWS ECR и задеплоить контейнер в AWS Lambda.

https://freecodecamp.org/news/serverless-architecture-with-aws-lambda/

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

Как использовать паттерн "разветвлённого компонента"

Выноси сложную условную отрисовку в отдельные компоненты.
Вместо множества v-if внутри одного компонента — создай отдельный компонент для каждого состояния.

Такой подход делает код читаемее и проще в поддержке со временем.

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

Совет дня:

В @nuxt_js есть множество способов задать текущий layout

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

Возможно, состояние (state) тебе вообще не нужно

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

"Как можно сократить префетчинг (чтобы оптимизировать расходы на хостинг),
не сильно теряя в скорости навигации в Next?"

Попробуй префетчинг по ховеру (prefetching on hover)

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

Что вы знаете о паттерне проектирования «Slots и Template Props»?

Если у вас есть пропс, который напрямую передаётся в шаблон, это хороший знак, что вместо него стоит использовать слот. Почему? Они выполняют схожую функцию, но слот даёт больше гибкости.

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

Поговорим о фрагментации в Options API и связности в Composition API

✅Фрагментация в Options API
По мере роста компонента Vue.js по размеру или сложности, разработчики сталкиваются с тем, что логика расползается по разным секциям.
Например, при обновлении нескольких реактивных состояний или связанных вычислений, разрозненная структура Options API затрудняет поддержку читаемости и целостности кода.

✅Связность в Composition API
Composition API побуждает инкапсулировать связанную логику в едином, цельном виде.
С помощью composition-функций можно группировать данные и методы, которые взаимодействуют друг с другом.
Это улучшает читаемость и упрощает ментальную модель взаимодействия разных частей компонента.

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

Composition API: Эффективная структура

Composition API предлагает упрощённый подход к архитектуре компонентов, акцентируя внимание на логической группировке функциональности и детализированных импортах.

Такая структура не только улучшает реактивность, но и минимизирует использование памяти за счёт устранения накладных расходов на прокси экземпляра. Код, написанный с использованием Composition API, позволяет доступ к переменным в области видимости, обходя прокси и обеспечивая прямой, оптимизированный доступ к реактивным свойствам.

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

На изображении вы можете увидеть пример Tree-shaking.

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

С nuxt_js компоненты обычно уничтожаются и пересоздаются при переходе между страницами, из-за чего их состояние сбрасывается. Установив свойство keepalive у компонента NuxtPage, Nuxt обернёт ваши страницы в Vue-компонент <KeepAlive>, сохраняя их состояние при навигации.

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

Фишка в TypeScript: оператор satisfies предотвращает "тихие" ошибки.

Он позволяет ловить опечатки уже на этапе компиляции.

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

Перенаправление журналов браузера в терминал в Next.js 15.4

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

devtoolSegmentExplorer в Next.js 15.4

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

Путаешься между as const и satisfies в TypeScript?

Посмотри на ключевые отличия, которые действительно важны

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

«Как сделать так, чтобы пиксель-арт не был размытым в Chrome?»

Попробуй image-rendering: pixelated

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

Паттерн Smart и Dumb компонентов — что нужно знать:

Разделяйте обработку данных и отображение. Smart-компоненты управляют логикой и загрузкой данных, dumb-компоненты просто принимают props и отвечают за отображение.

Кроме того, базовые компоненты используются как фундаментальные строительные блоки приложения (например, карточки, кнопки и т. д.) и по соглашению именуются с префиксами v, base или app.

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

Вопрос:

«Можно ли обновить searchParams в Next.js без создания отдельного клиентского компонента?»

Ответ:

Да — с помощью next/form

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