Привет всем!
На этой неделе много ссылок!
Рассылка запаздывает из-за технических проблем в Twitter. Надеюсь, я смог опубликовать его сейчас. Буду очень признателен за ретвит 🙏 проблемы не способствовали хорошему началу рассылки.
Отличные новости для Next.js: только что было объявлено об обновлении роутера!
React-Native также в центре внимания на этой неделе: 0.69 в RC, Expo SDK 45 и React-Native-Skia 👌.
⚠️ В ближайшие 2 недели выпуска не будет. Следующий выпуск будет 24 мая.
🙏 Поддержите информационный бюллетень:
- 😘 Порекомендуйте его своим друзьям: это действительно помогает!
- 💸 Спонсируйте эту неделю в React
- 😍 Пишите отзывы в Twitter
- 🧵 Ретвитните последнюю тему в Twitter
- 📨 Ответить на это письмо: отзывы приветствуются
- 👥 Следить на LinkedIn
Если вам нравится эта рассылка, подпишитесь на нее там:
- 🇬🇧 ThisWeekInReact.com
- 🇫🇷 ReactHebdo.fr
React
Click To Component
Новая очень практичная либа, которая позволяет легко открыть исходный файл React компонента, простым Option + Click
на интерфейсе. Поддерживает CRA, Next.js, Vite… Работает только с VS Code, но могут поддерживаться и другие IDE, например Intellij.
Zag
Zag — это коллекция примитивных компонентов, основанных на машинах состояний. Это позволяет отделить логику от фреймворка и предложить привязку для React, Vue, Solid… Это новое решение позволит легче адаптировать React Chakra UI lib к другим фреймворкам, разделяя при этом гораздо больше кода поведения.
Почему я не скучаю по React: история об использовании платформы
Джек работал в Google над Chrome DevTools в течение 2 лет. С тех пор он больше не использует React и делится отзывами о своем переходе на стандартизированные веб-интерфейсы API, не требующие зависимостей: формы, пользовательские элементы…
Переход с Next на Remix
Кристофер ради интереса перевел свой личный сайт с Next.js на Remix. Он дает свой отзыв и делится тем, как это повлияло на оценку Lighthouse. Он перечисляет основные изменения, которые ему пришлось сделать: интеграция Chakra, компонент Link, маршрутизация, выборка данных, метаданные…
Как разработчики HashiCorp ускоряют итерации с помощью ISR
Отзыв об использовании Incremental Static Regeneration из Next.js для сокращения времени сборки сайтов документации в HashiCorp. Новый режим ISR «по требованию» позволяет аннулировать кэш Next.js и, следовательно, давать немедленную обратную связь при публикации обновления.
Дополнительно:
- 💡 Обновление Next.js Router: Next.js получит вложенные маршруты и новый дизайн для работы с серверными компонентами и функциями React 18.
- 🧑🎨 3D-дизайн Spline теперь можно экспортировать в React-Three-Fiber: это позволит вам сделать ваши сцены интерактивными и добавить физику
- 🔗 Component Party: сайт, позволяющий легко сравнить синтаксис React с другими фреймворками (Vue, Svelte, Solid…) на различных сценариях использования
- 🏢 Convex: новая бессерверная база данных реального времени с привязкой к React. Они только что привлекли $27 млн. и хорошо интегрируются с Netlify или Vercel.
- 🎥 The Story of Concurrent React: 10 минут об истории привязки Concurrent React, с 2016 года до сегодняшнего дня. Отличная исследовательская работа
- 📦 Ultra 1.0: современный мета-фреймворк React для Deno только что анонсировал свой v1
- 📦 React 18.1: в основном исправления ошибок
- 📦 useTilg: удобный хук React для отладки
- 📦 zustand v4.0.0-rc.1
- 📦 Gatsby 4.13
- 🐦 Использование useReducer для управления односторонним булевым состоянием
- 📜 Создание терминальной Wordle-игры с помощью React Ink
- 📜 Управление React Monorepos с помощью Nx
React-Native
Expo SDK 45 beta теперь доступен
Новый SDK Expo стал доступен в бета-версии на неделю. Несколько классных новинок:
- React-Native 0.68.1: Expo обновляется до последней версии, но пока без включения рендеринга Fabric
- редизайн Expo Go, с лучшей интеграцией EAS Update и возможностью видеть/открывать ветки
- несколько либ переведены на JSI и/или Expo Sweet Module API
- совершенно новый expo CLI (бета-версия), который будет версионироваться и устанавливаться локально, а не глобально.
- либы-обёртки Expo устарели: оригинальные нативные либы можно использовать через плагины конфигурации
React Native Skia — для нас, для вас и для удовольствия
Skia — это 2D-движок Google, и вы наверняка им пользуетесь: Chrome, Flutter, Android… Shopify поддерживает разработку React-Native-Skia, чтобы предоставить графические/2D примитивы, отсутствующие в React-Native, и не быть ограниченным при реализации сложного дизайна. Либ предлагает выразительный декларативный API, а также императивный низкоуровневый API, совместимый с Flutter, который может помочь с поддержкой веб-технологий через React-Native-Web и CanvasKit.
Дополнительно:
- 📦 React-Native 0.69-rc.0: первая версия, основанная на React 18, с возможностью использования параллельных функций, если вы включите новую архитектуру!
- 📦 React-Native-Graph: новая библиотека графов с анимацией, основанная на React-Native-Skia
- 🎥 Charts with React-Native-Skia: последнее видео от William Candillon, связанное с вышеупомянутой библиотекой 😉
- 🐦 Предварительный просмотр React-Native-WishList: Marc Rousavy работает над новой мощной виртуализированной либой списков, которая должна исправить недостатки существующих в плане производительности
- 🎥 RN.live: Канал livestream Джамона Холмгрена.
- 🎙️ RNR 233 — React 18 и будущее React Native
- 📜 Использование RevenueCat с Expo’s Managed Workflow: показывает, как легко интегрировать нативную либу в Expo
- 📜 Twitter переходит на Jetpack Compose: меня до сих пор восхищает тот факт, что Twitter использует React-Native в вебе, но не React-Native в мобильных устройствах 😄.
- 📜 Apple готовится удалить почти 30% приложений в App Store: будьте осторожны, ваше старое приложение может оказаться неопубликованным 😅
- 📜 Какова производительность вашего пользовательского устройства?
- 📜 Эффективный способ использования PouchDB@7 на React Native в 2022 году
Другие
Переводчик ошибок TypeScript
Новый инструмент в процессе разработки, который переводит ваши ошибки TypeScript на человеческий язык, простой для понимания, с дополнительными пояснениями (источник). Он даже может интегрироваться в вашу IDE (расширение VS Code).
Поддержание TypeScript Type Guard в безопасности и актуальности
Поднимает проблему, с которой я никогда не сталкивался 😅: если у вас есть защита типов, основанная на атрибуте объекта, и вы добавляете второй атрибут, ваша защита типов становится устаревшей, но TypeScript все равно компилируется.
Дополнительные возможности:
- Web Scraping via Javascript Runtime Heap Snapshots: оригинальная техника скраппинга, которая заключается в извлечении JS объектов прямо в память.
- Node 16.15: экспериментальная поддержка
fetch
. - Lerna теперь официально мертвый проект. Проект официально не поддерживается, но есть альтернативы, такие как Nx и Turborepo
- Свежий релиз Nx 14
- Zaplib post-mortem: отзывы, еще раз доказывающие, что Rust и Wasm не всегда быстрее JavaScript
- WebAssembly vs Javascript: «не используйте WebAssembly в первую очередь ради производительности»
- Обнаружение компонентов пользовательского интерфейса с помощью TypeScript Compiler API
- Неправильное использование функций утверждения TypeScript для развлечения и прибыли
- SemVer для TS на практике
- Сужение типов в TypeScript
- google/wireit: модернизация ваших скриптов npm, чтобы сделать их умнее и эффективнее
- Четыре эпохи фреймворков JavaScript