🖥 DOM3D.js

Кодеры, ловите абсолютно безумный проект: разработчик написал инструмент для просмотра HTML/DOM, который позволяет оценить ваш сайт в 3D.

🖥 GitHub

@javascriptv

🖥 Основные тенденции развития JavaScript

Каковы основные тренды в JavaScript? На какие технологии и инструменты стоит обратить пристальное внимание?
Держите годный список от руководителя обучения JavaScript в EPAM Андрея Гордийчука — вот они, актуальные тренды:

⏩Переход к новым фреймворкам фронтенда
Одностраничные приложения (SPAs) и соответствующие фреймворки JavaScript, такие как React, Angular и Vue.js, все еще остаются популярными. Существует четкая тенденция перехода приложений с обработки на стороне клиента (CSR) на отрисовку на стороне сервера (SSR). Это требует от инженеров изучения новых фреймворков, таких как Svelte, Solid.js и Qwik.

⏩Производительность и рендеринг
Серверный рендеринг (SSR) и генерация статических сайтов (SSG) конкурируют в улучшении производительности и SEO. Последние несколько лет шаблоны рендеринга были относительно простыми, однако все более популярными становятся новые подходы, такие как Partial Hydration, Progressive Hydration и Island Architectures (Astro).

⏩Дизайн-фреймворки и дизайн-системы
Тенденции в дизайне пользовательского интерфейса (UI) включают:
— Minimal flat design и инструменты;
— Neo-brutalism on UI (контрастные цвета, мультяшная графика);
— Motion design.
Со стороны разработчиков такие инструменты, как Tailwindcss (API для вашей системы проектирования), PureCSS и Primer становятся популярнее, чем Bootstrap.

⏩Создание инструментов и монорепозиториев
На основе вышеупомянутых результатов, автоматизация процессов сборки, тестирования и развертывания приложений также будет претерпевать изменения. У Webpack более устоявшаяся экосистема и широкий спектр доступных плагинов, что делает его подходящим для более сложных проектов, но новые инструменты Vite и Turbopack становятся чрезвычайно востребованными благодаря своему более быстрому подходу встроенного модуля-скрипта и более простой конфигурации (что делает их более удобными в использовании), мгновенным обновлениям без полной пересборки, меньшим размером пакета.

📎 Читать подробнее

@javascriptv

🖥 Q-OTP - двухфакторная аутентификация на VueJS

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

Компонент подключается как Quasar App Extension:

quasar ext add q-otp

Пример подключения:

<template>
  <QOtp
      field-classes="q-ml-xs q-mr-xs"
      @complete="(code) => alert(code)"
  />
</template>
<script lang="ts" setup>
  import QOtp from 'quasar-app-extension-q-otp'
</script>

🖥 Исходный код доступен на GitHub под лицензией MIT

@javascriptv