🏄
Matsuri-tech Frontend Weekly 2023-12-01

hrdtbs

hrdtbs

2023年12月1日
BiomeStorybookMFW

社内向けに、フロントエンド関連のニュースや業務で発生したQ&A、利用しているライブラリなどの情報を定期的に書いています。

社内の開発部メンバーに向けて直近でリリースされたライブラリなどの情報をMatsuri-tech Frontend Weeklyとしてまとめています。内容は実務や趣味で使えそうなものを中心に扱っており、網羅的ではなく偏りがあります。

# Biome v1.4.0 - Biome formatter wins the Prettier challenge

2023年11月27日にBiome v1.4.0がリリースされました。

Biome formatter wins the Prettier challenge

Prettier を Rust で書き換えたプロジェクトに報奨金$20k を支払うプログラムは Biomeが勝ち取りました。

Biome v1.4.0では、JS/TS/JSXのフォーマットが96%以上Prettier互換になりました。

# Storybook 7.6

2023年11月29日にStorybook 7.6がリリースされました。

Storybook 7.6

Storybook 8に向けたパフォーマンスやUXの改善が行われています。Webpackプロジェクトでは、BabelからSWCへ移行することで、start timeが50%以上短縮されます。

// .storybook/main.js
export default {
  framework: {
    name: '@storybook/your-framework', // react-webpack5|next|vue-webpack5|etc
    options: { builder: { useSWC: true } }
  }
};

テストの改善も行われています。@storybook/test はJestではなくVitestのexpectを利用するようになりました。またテストモード --testにより、docgen分析の実行やドキュメントのコンパイルなどを省いてテストを実行することが出来るようになりました。

# Getting started with CSS container queries | MDN Blog

MDNによるCSSのContainer queryの紹介記事。基本的な使い方が丁寧に解説されている。