Полноценный гайд по инкрементальной статической генерации в Next.js
#jsarticle #javascript #nextjs #frontend #webdev #react
#jsarticle #javascript #nextjs #frontend #webdev #react
Smashing Magazine
A Complete Guide To Incremental Static Regeneration (ISR) With Next.js — Smashing Magazine
Incremental Static Regeneration (ISR) is a new evolution of the Jamstack, allowing you to update static content instantly without needing a full rebuild of your site. The hybrid approach of Next.js allows you to use ISR for e-commerce, marketing pages, blog…
use-nft - React хук для получения информации о любом NFT
#jslib #react #web3 #webdev #frontend #javascript #nft #ethereum #blockchain
#jslib #react #web3 #webdev #frontend #javascript #nft #ethereum #blockchain
GitHub
GitHub - bpierre/use-nft: 🍮 React hook to fetch metadata from any NFT.
🍮 React hook to fetch metadata from any NFT. Contribute to bpierre/use-nft development by creating an account on GitHub.
Inspx — React компонент для инспектирования макета
Позволяет отлаживать внутренние и внешние отступы, размеры, высоту и ширину
#jslib #jstools #javascript #react #frontend #webdev
Позволяет отлаживать внутренние и внешние отступы, размеры, высоту и ширину
#jslib #jstools #javascript #react #frontend #webdev
GitHub
GitHub - raunofreiberg/inspx: Pixel perfect layout inspection.
Pixel perfect layout inspection. Contribute to raunofreiberg/inspx development by creating an account on GitHub.
Вышел Next.js 10.2
- prod сборка на 60% быстрее с помощью кэширования
- fast refresh ускорился на 0.1-0.2s
- запуск
- улучшена доступность
- расширен функционал redirects / rewrites
- автоматическая оптимизация шрифтов
#jsrelease #nextjs #fullstack #frontend #webdev #react #javascript
- prod сборка на 60% быстрее с помощью кэширования
- fast refresh ускорился на 0.1-0.2s
- запуск
next dev на 24% быстрее- улучшена доступность
- расширен функционал redirects / rewrites
- автоматическая оптимизация шрифтов
#jsrelease #nextjs #fullstack #frontend #webdev #react #javascript
nextjs.org
Next.js 10.2
Next.js 10.2 introduces performance improvements (faster builds, refresh, and startup), improved accessibility, Automatic Webfont Optimization, and more!
Packup - сборщик веб приложений без конфигурации, работающий на Deno
- Поддержка TS из коробки
- Module resolution совместимый с Deno
- Очень быстрый благодаря esbuild
Проект находится в ранней разработке, в будущем планируется добавить CSS импорты, оптимизацию и CLI флаги из Parcel
#deno #jstools #frontend #webdev
- Поддержка TS из коробки
- Module resolution совместимый с Deno
- Очень быстрый благодаря esbuild
Проект находится в ранней разработке, в будущем планируется добавить CSS импорты, оптимизацию и CLI флаги из Parcel
#deno #jstools #frontend #webdev
GitHub
GitHub - kt3k/packup: 📦 Zero-config web application packager for Deno
📦 Zero-config web application packager for Deno. Contribute to kt3k/packup development by creating an account on GitHub.
Внедрение Google форм в статический сайт без использования iframe
#jsarticle #frontend #webdev #javascript #html
#jsarticle #frontend #webdev #javascript #html
Atomic Spin
Embedding Google Forms in a Static Site
This approach to embedding Google Forms offers more customizability than embedding a Google Form iframe and isn’t difficult to implement.
Vuestic - UI фреймворк для Vue 3
- более 50 компонентов (с адаптивностью)
- хорошее a11y
- поддержка Chrome, Firefox, Safari 10+ и Edge
#jslib #vue #frontend #webdev #javascript
- более 50 компонентов (с адаптивностью)
- хорошее a11y
- поддержка Chrome, Firefox, Safari 10+ и Edge
#jslib #vue #frontend #webdev #javascript
Parcel 2 Beta 3
- компилятор был переписан на Rust и стал в 10 раз быстрее
- tree-shaking для динамических импортов
- tree-shaking для CSS модулей
- новый флаг:
- HMR для плагинов (полезно при разработке плагинов для Parcel)
- меньше зависимостей
#jsrelease #javascript #parcel #jstools #frontend #webdev
- компилятор был переписан на Rust и стал в 10 раз быстрее
- tree-shaking для динамических импортов
- tree-shaking для CSS модулей
- новый флаг:
--lazy. при его включении Parcel будет собирать только те файлы, которые меняются- HMR для плагинов (полезно при разработке плагинов для Parcel)
- меньше зависимостей
#jsrelease #javascript #parcel #jstools #frontend #webdev
Logux - менеджер состояния для React, Vue и Svelte от создателя PostCSS
- Весит всего 157 байт и не имеет зависимостей
- Библиотека довольно быстрая, благодаря атомарному состоянию, которое не вызывает ререндер каждого компонента
- Хорошо работает с tree-shaking
- Не использует CPU и память пока не рендерятся компоненты, подписанные на состояние
- Поддерживает TypeScript
#jslib #javascript #react #svelte #vue #frontend #webdev #typescript
- Весит всего 157 байт и не имеет зависимостей
- Библиотека довольно быстрая, благодаря атомарному состоянию, которое не вызывает ререндер каждого компонента
- Хорошо работает с tree-shaking
- Не использует CPU и память пока не рендерятся компоненты, подписанные на состояние
- Поддерживает TypeScript
#jslib #javascript #react #svelte #vue #frontend #webdev #typescript
GitHub
GitHub - nanostores/nanostores: A tiny (298 bytes) state manager for React/RN/Preact/Vue/Svelte with many atomic tree-shakable…
A tiny (298 bytes) state manager for React/RN/Preact/Vue/Svelte with many atomic tree-shakable stores - GitHub - nanostores/nanostores: A tiny (298 bytes) state manager for React/RN/Preact/Vue/Svel...
Интеграция Notion и Next.js
#jsarticle #nodejs #nextjs #fullstack #notion #frontend #react #webdev #backend
#jsarticle #nodejs #nextjs #fullstack #notion #frontend #react #webdev #backend
BlogPop by Georgey
How to use Notion API with NextJS
Notion API is finally here, and it's so cool. But you must be wondering what is Notion in the first case? Well, it's a powerful productivity tool for managing your daily day-to-day tasks, or maybe jotting down a lot of ideas you want to put up in you...
Gqless - GraphQL клиент, в котором не нужно писать запросы
Работает в рантайме с помощью
Например:
const { countries: { flag } } = useQuery()
создаст GraphQL запрос
Из фич:
- Типы из коробки
- Работает с React, включая Suspense и хуки
- Готов к использованию в продакшене (поддерживает кэширование, SSR и т.д.)
#graphql #jslib #javascript #react #frontend #webdev
Работает в рантайме с помощью
Proxy API, который смотрит, какие поля были запрошены.Например:
const { countries: { flag } } = useQuery()
создаст GraphQL запрос
query { countries { flag } }Из фич:
- Типы из коробки
- Работает с React, включая Suspense и хуки
- Готов к использованию в продакшене (поддерживает кэширование, SSR и т.д.)
#graphql #jslib #javascript #react #frontend #webdev
ts-audio — абстракция над AudioContext API, написанная на TypeScript
- значительно упрощает использование AudioContext
- поддерживает все современные браузеры
- можно легко создавать плейлисты
- не имеет зависимостей
#jslib #javascript #frontend #webdev #typescript
- значительно упрощает использование AudioContext
- поддерживает все современные браузеры
- можно легко создавать плейлисты
- не имеет зависимостей
#jslib #javascript #frontend #webdev #typescript
GitHub
GitHub - EvandroLG/ts-audio: :musical_score: ts-audio is an agnostic library that makes it easy to work with AudioContext and create…
:musical_score: ts-audio is an agnostic library that makes it easy to work with AudioContext and create audio playlists in the browser - EvandroLG/ts-audio
Canvg - JavaScript библиотека для парсинга SVG и рендера в Canvas
Либа полезна для отображения векторных изображений в растровом Canvas
- Работает как и в браузере, так и на сервере
- Имеет пресеты для Node.js и OffscreenCanvas
- Написана на TypeScript
#jslib #javascript #frontend #webdev #canvas
Либа полезна для отображения векторных изображений в растровом Canvas
- Работает как и в браузере, так и на сервере
- Имеет пресеты для Node.js и OffscreenCanvas
- Написана на TypeScript
#jslib #javascript #frontend #webdev #canvas
GitHub
GitHub - canvg/canvg: JavaScript SVG parser and renderer on Canvas
JavaScript SVG parser and renderer on Canvas. Contribute to canvg/canvg development by creating an account on GitHub.