🦀

View Transition APIなど : Cybozu Frontend Weekly (2023-03-14号)

2023/03/16に公開

こんにちは!サイボウズ株式会社フロントエンドエキスパートチームの じまぐ です。

サイボウズでは毎週火曜日に Frontend Weekly という「1 週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。

今回は、2023/03/14 の Frontend Weekly で取り上げた記事や話題を紹介します。

取り上げた記事・話題

Chrome の DevTools 上で HTTP レスポンスヘッダーが上書きできるようになった

https://twitter.com/ChromeDevTools/status/1627654304180981762

Chrome 111 から、フラグをオンにすることでローカルでレスポンスヘッダーを上書きできるようになりました。ローカルで CORS の動作を確認するなど、何かしら便利に使えそうです。

SvelteKit v1.0 以降に追加された新機能の紹介

https://svelte.dev/blog/streaming-snapshots-sveltekit

SvelteKit v1.0 の新機能の紹介記事です。新機能として次のような機能が紹介されていました。

  • load function で、重要ではないデータの読み込み完了を待たずにページの描画が開始できるようになった
  • フォームの入力値の復元ができるようになった
  • Vercel 上で ISR(incremental static regeneration)ができるようになった

アクセシビリティに対応したサイトのギャラリー

https://www.aaa11y.com/

アクセシビリティ対応がされているサイトのギャラリー。サイトコンテンツのタイプやカテゴリで絞り込みできるのでアクセシビリティ対応の参考になりそうです。サイトごとのアクセシビリティポリシーページが参照しやすいです。

Turborepo が Go から Rust へ移行している話

https://vercel.com/blog/turborepo-migration-go-rust

Turborepo が Go から Rust への移行を進めています。記事中では Go と Rust の言語ごとの思想の違いや機能を比較しつつ、Turborepo の開発においては Rust のほうがニーズにマッチしていると説明しています。

TypeScript 向けの Signals ライブラリ。React でも使える

https://github.com/tldraw/signia

シンプルな Signals のライブラリです。開発元は作図ツールで知られるtldraw。Signia を React で使えるようにする signia-react も公開されています。

Rust 製のバンドラー Rspack が公開された

https://www.rspack.dev/

開発元は TikTok で有名な ByteDance。webpack 互換のバンドラーで、よく使われているような loader との互換性があるようです。

Connect は TanStack Query をサポートしている

https://buf.build/blog/introducing-connect-query/

先日Node.js 対応が追加されたConnect ですが、TanStack Query をサポートしていることが社内で話題になりました。

useQueryuseQueryClientといった、TanStack Query の利用者であれば馴染みのある hooks で Connect を利用できます。

View Transition API が Chrome 111 で実装された

https://developer.chrome.com/blog/spa-view-transitions-land/

https://zenn.dev/yhatt/articles/cfa6c78fabc8fa

https://twitter.com/clockmaker/status/1633232835023872002?s=20

画面遷移時などに接続型アニメーションを実現できる API が追加されました。ネイティブアプリのような画面遷移が、JavaScript と CSS で実現できるようになりました。

現時点では単一 HTML の SPA の挙動として利用できます。

あとがき

サイボウズでは毎月、最終火曜日の 17 時から Frontend Monthly というイベントを YouTube Live で開催しています。その月のフロントエンド注目ニュースや、ゲストを呼んでの対談など、フロントエンドに関する発信をしていますので是非どうぞ!

https://cybozu.github.io/frontend-monthly/

また、サイボウズでは一緒にサイボウズのフロントエンドをより良くする仲間を募集しています。興味ある方はこちら ↓ から!

【フロントエンドエキスパート】
サイボウズのフロントエンドを最高にするためのチームです。

https://cybozu.github.io/frontend-expert/

https://cybozu.co.jp/recruit/entry/career/front-end-expert.html

【フロントエンドエンジニア(kintone アーキテクチャ刷新 PJ)】
クラウドサービス「kintone」のフロントエンドを新しくしています。

https://cybozu.co.jp/recruit/entry/career/front-end-engineer-kintone.html

サイボウズ フロントエンド

Discussion