Самые большие обновления WWDC 2025, Oxlint, наконец, стабильны, и новейшее обновление PNPM - на этой неделе в JS
17 июня 2025 г.Привет, энтузиасты JavaScript!
Добро пожаловать в новое издание "На этой неделе в JavaScript"
На этой неделе мы распаковываем Safari 26 Beta, изменяющие игру, обновления Webkit, PNPM 10.12 и прокатные перспективы PNPM 10.12 и оспаривающие лайтинг Oxlint 1.0. Как всегда, мы также поговорим о некоторых мощных инструментах, чтобы поднять ваш рабочий процесс разработки.
WWDC 2025 & Safari 26 Бета: Webkit в Swiftui, Webgpu и CSS
Beta Apple Safari 26Выпущенная на этой неделе, представляет 67 новых функций и 107 улучшений, и Webkit крадет шоу. The Star-это совершенно новый Webkit API, адаптированный для Swift и Swiftui, что делает его плавным для интеграции веб-контента в приложения по iOS, iPados, MacOS и Visionos. Давайте разберем ключевые дополнения.
WebView и Web -Page: новая эра для веб -интеграции
Тип WebView, собственное представление Swiftui, упрощает отображение веб -контента. Просто с URL, вы можете встроить веб -страницу в свое приложение:
struct ContentView: View { var body: some View { WebView(url: URL(string: "https://www.webkit.org")) } }WebView поддерживает набор модификаторов просмотра, таких как WebViewScrollPosition, WebViewMagnificationStures и FindNavigator, позволяя мелкозернистому управлению пользовательским опытом. Для расширенных вариантов использования подключите WebView с веб -страницей, новым наблюдаемым классом, предназначенным для управления веб -контентом.
Веб -страница позволяет загружать, контролировать и общаться с веб -контентом, даже не отображая ее напрямую. Его наблюдаемые свойства и функции делают реагирующие парадигмы Swiftui.
Например, вы можете создать динамичный просмотр статьи:struct ArticleView: View { @Environment(ArticleViewModel.self) private var model var body: some View { WebView(model.page) navigationTitle(model.page.title) } }Протокол Urlschemehandler использует быструю параллелизм для обработки пользовательских схем, что позволяет загружать локальные ресурсы с асинхронностью. Между тем, WebPage.NavigationDecisting и WebPage.dialogPresenting Протоколы позволяют настроить навигационные политики и презентации диалога JavaScript, предлагая непревзойденное управление веб -взаимодействиями в вашем приложении.
- Этот API дает возможность веб -разработчикам использовать свои навыки JavaScript и HTML для создания нативных приложений Apple, преодолевая разрыв между веб -разработкой и нативным разработкой. Независимо от того, создаете ли вы читатель новостей или панель панели, усилившись в Интернете, эти инструменты делают интеграцию более плавной, чем когда-либо.
WebGPU: вычисления на основе графических данных в Интернете
- Safari 26 Beta представляет WebGPU, JavaScript API, который революционизирует программирование GPU. В отличие от WebGL, который был построен на OpenGL и требовал тяжелого перевода в современные графические процессоры, карты WebGPU непосредственно в металлическую структуру Apple, снижение накладных расходов и повышение производительности. Он поддерживает графический рендеринг и вводит вычислительные шейдеры для вычислений общего назначения GPU-первого для Интернета.
- WebGPU использует язык затенения WebGPU (WGSL, произносится как «парик-сил»), безопасный, проверенный язык, предназначенный для Интернета. WGSL избегает рисков, таких как неконтролируемые добычи границ, обеспечивая безопасность, не жертвуя властью. После более чем года в предварительном просмотре технологий Safari, WebGPU теперь стабилен в бета -версии Safari 26 на платформах Apple.
- Такие рамки, как Babylon.js, Three.js, Unity и Transformers.js, уже поддерживают WebGPU, предоставляя потрясающие визуальные эффекты и сложные вычисления в браузере. Для разработчиков оптимизированная проверка WebGPU сводит к минимуму показатели производительности, приближаясь к скорости приложения.
Позиционирование якоря CSS: умные макеты
Позиционирование якоря, новый механизм макета CSS, упрощает элементы привязки друг к другу. В сочетании с атрибутом Popover (представленным в Safari 17.0), он идеально подходит для отзывчивых меню, подсказки инструментов и наложений. Синтаксис позиции делает макеты интуитивно понятными:
.thing-that-gets-anchored-to { anchor-name: --profile-button; } .item-that-pops-up { position-anchor: --profile-button; position: absolute; top: anchor(bottom); left: anchor(left); }Функция Anchor () в сочетании с абсолютным позиционированием предлагает управление Pixel, идеально подходит для анимированных якорей или многопользовательских макетов. Эта функция расширяет возможности макета Интернета, делая сложные проекты более доступными. Safari 26 Beta Усовершенствования CSS укрепляют свою позицию в качестве браузера, удобного для разработчиков.
PNPM 10.12: почти мгновенные установки и расширенные каталоги
- PNPM 10.12.1Выпущенная на этой неделе, управление пакетами JavaScript с начинкой с экспериментальным глобальным виртуальным магазином и обновленной системой каталога версий. Эти обновления делают PNPM лучшим выбором для разработчиков, управляющих MonorePos или крупными проектами.
Глобальные виртуальные магазины Time Slash, связывая зависимости с общим каталогом <store-path>/links, где пакеты хранятся в папках, названных в честь их хэшей графика зависимостей. Этот подход, вдохновленный NIXOS, позволяет нескольким проектам повторно использовать зависимости без загрузки, обеспечивая почти мгновенные установки на теплые кэши. Включить это с:
pnpm config -g set enable-global-virtual-store true Or add to pnpm-workspace.yaml: enableGlobalVirtualStore: truePNPM Auto-Disables Это в средах CI, чтобы избежать замедления холодных кэшей. Демонстрация YouTube показывает скорость, а PR #8190 подробно описывает технологии. Zoltan Kochan, поддерживающий PNPM, выделяет свою графическую изоляцию для надежной производительности.
- Система каталога версий получает гибкость с настройками каталогов: строгое обеспечение соблюдения версий каталога, предпочтение позволяет задолженность, а ручные (по умолчанию) пропускают автоматические добавления. Новые варианты CLI-Save-Catalog и--save-catalog-name = <mame> Сохранить зависимости от PNPM-workspace.yaml и package.json с каталогом: Specifiers (PR #9425). Команда обновления PNPM теперь поддерживает протоколы каталога, оптимизируя обновления зависимостей.
- Незначительные настройки включают в себя семантическую сортировку версии для патча PNPM, более четкие сообщения об ошибках для несоответствующих спецификаторов (PR #9598) и настройку CI для Flag Ci сред. Полудеривающие изменения обновлений побочных эффектов кэша, требующих нового кэша (PR #9605). Проверьте заметки о выпуске для получения дополнительной информации.
Oxlint 1.0: переопределение производительности вкладки
- Oxlint 1.0ВПервый стабильный выпуск JavaScript и TypeScript Linter, пронизанного ржавчином, обеспечивает более высокую производительность в 50–100x, чем Eslint. Поддерживая более 500 правил с настройкой с нулевой конфигурацией, оно принято Shopify, Airbnb и Mercedes-Benz, преобразуя рабочие процессы подкладки.
Oxlint обрабатывает 10 000 файлов в секунду, сняв 264 925 файлов за 22,5 секунды на 10 потоках. Airbnb Lints 126 000+ файлов за 7 секунд с такими правилами, такими как Barrel-File, где Eslint терпит неудачу. Mercedes-Benz сократил время Lint на 71–97%, и Shopify использует его в своей консоли администратора. Чингы показывают Oxlint на уровне 615,3 мс (многопоточная) по сравнению с 33,481 с Eslint. Проекты с открытым исходным кодом, такие как Bun и Preact также получают выгоду.
Начните сжимать с:npx oxlint@latestНастройте через .oxlintrc.json, на основе плоской конфигурации Eslint V8. Инструмент-мигрирование Oxlint преобразует конфигурации Eslint, а Eslint-Plugin-Oxlint поддерживает гибридные установки. Правила включают в себя Eslint, TypeScript-ESLint и плагины, такие как Eslint-Plugin-React, плюс уникальные правила Oxlint, такие как Bad-Comparison-последовательность. Поддержка редактора охватывает Code, Intellij и Zed. Смотрите руководство по установке.
- Семантическое управление Oxlint обеспечивает стабильность, с небольшими выпусками, добавляя правила, которые могут повлиять на CI. Просмотрите Руководство по управлению версией. С помощью сопровождающего Кэмерон и растущей команды Oxlint будет быстро развиваться.
Инструменты и релизы, о которых вы должны знать
Шутка 30: быстрее, стройнее, лучше
Шутка 30Приносит более быстрые тестовые прогоны и более низкое использование памяти, с улучшением скорости до 37% и на 77% меньше памяти в крупных проектах. Он отбрасывает узел 14/16/19/21 поддержку, обновляет JSDOM до V26 и требует TypeScript 5.4+. Новые функции включают в себя ожидайте.
Настраиваемые повторные поиски и jest.unstable_unmockmodule () усиливает управление. Проверьте руководство по миграции для нарушения изменений.
Orange ORM: бесшовная интеграция базы данных
Оранжевый ормявляется мощным объектно-реляционным отображением для node.js, bun и deno, поддерживающего типографию и JavaScript. Его интуитивно понятные запросы и активный шаблон записей упрощают взаимодействия базы данных без генерации кода. Он работает в браузерах через плагин Express.js, обеспечивая безопасную обработку учетных данных. Идеально подходит для разработчиков, нуждающихся в гибких типичных решениях базы данных.
Оборудование VUE: Frontend Toolkit
Оборудование VUEПредлагает непревзойденные плагины и композиции для приложений Vue и Nuxt. С помощью чистого API он уменьшает сложность, используя переменные CSS, сгруппированные варианты и открытое состояние через атрибуты данных. Он идеально подходит для разработчиков, создающих современные веб -приложения без переосмысления общих решений.
Darkmodejs: Easy Dark Mode
DarkmodejsУпрощает темный режим в Интернете, используя медиа-запрос Prefers-Scheme и API MatchMedia. Он поддерживает MacOS 10.14+, iOS 13+ и Windows 10+, с V2+с использованием AddEventListener для современной совместимости. Легкая утилита для сайтов с учетом тем.
И это все для тридцати девятого выпуска "На этой неделе в JavaScript", принесенный вамJam.dev- Инструмент, который делает невозможным для вашей команды отправить вам плохие отчеты об ошибках.
Не стесняйтесь поделиться этим информационным бюллетенем с коллегой -разработчиком и убедитесь, что вы следите за более еженедельными обновлениями.
До следующего раза, счастливого кодирования!
Оригинал