Transcript
00:00:00Bun最大かつ最も物議を醸すアップデート、Rustで書き直されたBun 1.4がリリースされました.
00:00:04書き直しを巡るドラマについては以前動画を作ったので、今回は新機能に絞って見ていきましょう.
00:00:07個人的にも気に入っている機能、特に標準ライブラリ関連の機能がいくつかあります.
00:00:11ヘッドレスブラウザ、画像ライブラリ、疑似端末、マークダウンが組み込み機能となり,
00:00:15クロンジョブやテーブルなどが追加され、使っていたかもしれない15個の依存関係を置き換えます.
00:00:19ここ数年、JavaScriptにおける最大の不満の一つは標準ライブラリの不足でした.
00:00:23Bunはその問題を解決しようとしており、毎週のようにサプライチェーン攻撃が起きる世界において素晴らしい動きと言えます.
00:00:30まず、PlaywrightやPuppeteerをアンインストールし、代わりにBun WebViewを使用できるようになります.
00:00:37このコードを使えば、ヘッドレスブラウザを制御し、チャンネル登録ボタンを見つけてクリックできます.
00:00:41もっとも、これをあなたのマシーンで直接実行することはできないので、チャンネル登録はご自身でお願いします.
00:00:44クリック、入力、キー押下、スクロールといったすべての入力メソッドは、ネイティブのブラウザイベントを発行します.
00:00:48そのため、ページ側からは本物のユーザーとして認識されます。MacではシステムのWebKitを使用するため,
00:00:52Safariのエンジンとなり、追加のインストールは不要です。ただしChromeのインスタンスが必要な場合は,
00:00:56バックエンドオプションにChromeを設定すれば、インストール済みのChromeやChromiumを利用できます.
00:01:01これはWindowsやLinuxを使用している場合に行う方法です。ヘッドレスのChromeサブプロセスを起動することも,
00:01:04すでに実行中のChromeインスタンスに接続することも可能です。このコードを使えば,
00:01:09Macで開いているバージョンのChromeをすべてBunから操作できます。さらに,
00:01:13Evaluateを使用してページ上でJavaScriptを実行し、その結果をネイティブの
00:01:17JavaScriptの値として受け取ることもできます。目的の機能に対するAPIがまだない場合は,
00:01:21生のCDPコマンドに移行することも可能です。軽量なブラウザ自動化にはかなり良さそうですが,
00:01:25Playwrightを完全に置き換えるには至っていないと思います。テストランナーやトレースビューアはありませんが,
00:01:29スクレイピングやコンピューター利用スクリプトなどの用途としては悪くない選択肢です.
00:01:32次に、Sharpをアンインストールして代わりにBun.imageを使いましょう。これは完全な画像ライブラリで,
00:01:37ファイルを読み込み、.imageを呼び出して、サイズ変更、回転,
00:01:42反転、上下反転、明度の変更、シャープネスの調整、そして多様な画像フォーマットへの変換などの操作をチェインできます.
00:01:46また、ピクセルデータをデコードすることなく、幅、高さ、フォーマットなどのメタデータを読み取ることも可能です.
00:01:50私が本当に気に入っているもう一つの優れた機能は、プレースホルダー画像を生成できる機能です.
00:01:54これは、実際の画像が読み込まれる前にHTML内にインライン展開できる低品質なバージョンの画像です.
00:01:59Bun.imageは、私が使うのを最も楽しみにしている機能の一つです。過去にデプロイやビルドで,
00:02:04Sharpに関連する問題に直面したことがあるからです。Bunを使えば,
00:02:08もうそのことで悩む必要はありません。Markedについても同様に気にする必要がなくなります,
00:02:12MarkdownのパースにBun.markdownをそのまま使えるようになったからです。APIは3つあります.
00:02:16Bun.markdown.htmlはMarkdownをHTML文字列にレンダリングします。Bun.markdown.renderは、各要素に対して,
00:02:22カスタムコールバックを使用してMarkdownをレンダリングします。これにより、カスタムクラスを持つHTMLや,
00:02:27ANSIターミナル出力、その他の文字列形式で柔軟にレンダリングできます。Bun.markdown.reactはMarkdownをReact.jsxにレンダリングし,
00:02:33各要素に使用したい任意のコンポーネントを渡すこともできるため、非常に美しくスタイリングされた,
00:02:37Markdownを取得できます。希望するMarkdown機能を制御するために切り替え可能なオプションも多数用意されています.
00:02:41GitHub形式のテーブル、自動リンク、見出しID、Wikiリンクなどを利用できます,
00:02:45ただし1点注意として、HTML出力はサニタイズされないため,
00:02:50生のHTML、イベントヘッダー属性、JavaScriptなどはそのまま通過します。そのため,
00:02:54ユーザーが書いたMarkdownをレンダリングする場合は、依然としてご自身で解決すべき問題となります。とはいえ、現在では,
00:02:59非常に多くのMarkdownが生成されているため、これはかなり良い追加機能だと思われます。次に進みましょう,
00:03:03Node.ptyもアンインストールできます。Bun.terminalは組み込みの疑似端末を提供し,
00:03:08JavaScriptからBash、Vim、HTOPを操作できるようになります。Electronアプリ内にターミナルを組み込もうとしたことがある人なら,
00:03:12その苦労がよくわかるはずです。これは実際にはBun.spawnへの追加機能であり,
00:03:17ターミナルオプションを渡すことで、疑似端末がアタッチされたサブプロセスを起動します。サブプロセスからは本物のターミナルに見えるため,
00:03:22カラー出力、カーソル移動、インタラクティブなプロンプトが可能になります。ターミナルが用意できれば,
00:03:26ターミナルへのデータ書き込み、サイズ変更、閉じる処理など多くの操作が可能になります。また,
00:03:31独自のターミナルを作成して、サブプロセス間で再利用することも可能です。こうした機能のすべてに,
00:03:35ある共通のパターンが見えてきます。Claude Codeが使いそうな機能ばかりなので,
00:03:39これらが大規模に活用されているところを確認できるよう、オープンソース化してほしいものです。次にアンインストールする依存関係は,
00:03:43Node.cronです。これからはBun.cronをそのまま使えるからです。関数を渡せば,
00:03:47システムクロンを介さずイベントループ上で単純に実行されますが、スクリプトを渡せば,
00:03:51Linuxではcrontab、macOSではlaunchd、Windowsではタスクスケジューラを実際に使用するOSレベルのクロンジョブが登録されます.
00:03:56曜日指定やdailyなどのヘルパーを含む標準的なクロン構文を使用でき,
00:04:01そのクロン構文の解析もサポートされているため、システムのローカルタイムゾーンにおける次回の一致する日時を返します.
00:04:05タイムゾーンといえば、すべてのジョブはデフォルトでローカルタイムで実行されますが,
00:04:11これを変更するための明示的なオプションもあるため、いつ実行されるかを確実に把握できます.
00:04:15スケジュールに沿って次にお伝えするのは、concurrentlyやnpm-run-allをアンインストールすることです。Bunには独自の,
00:04:20parallelオプションが用意されたからです。このフラグを使用すると、複数のpackage.jsonスクリプトを同時に実行でき.
00:04:24出力には元のスクリプト名がプレフィックスとしてきれいに付与されます。また、スクリプト名にグロブパターンを使用したり,
00:04:28ワークスペース内でどのパッケージに対してコマンドを実行するかを絞り込むフィルター機能もあります.
00:04:32さらに、いずれかのスクリプトでエラーが発生した場合でも、他のスクリプトの実行を継続させるオプションも備わっています.
00:04:37並行実行だけでなく、sequentialを使用してスクリプトを1つずつ順番に実行することも可能です,
00:04:41その際も同様にプレフィックス付きの出力やフィルタリングを利用できます。これは個人的に最も利用頻度が高くなりそうな機能です.
00:04:45次にアンインストールするのは、あらゆるtarアーカイブライブラリです。Bun.archiveは、tarおよびgzipの高速なネイティブ実装です.
00:04:50アーカイブの作成は、キーがパスで値がコンテンツであるオブジェクトを作成するだけで行えます.
00:04:55コンテンツには、文字列、Blob、Uint8Array、ArrayBufferなど、あらゆるものを指定できます。圧縮については,
00:05:00compressオプションをgzipに設定し、1から12までのレベルを指定して利用できます.
00:05:05もちろん、特定のファイルのみを抽出するためのグロブパターンなどのオプションを使って展開することも可能です,
00:05:10そして本当に気に入っている機能として、アーカイブを展開せずに中身を読み取ることができます.
00:05:14このコードを使えば、npmレジストリからlodashを取得し、ファイルを1つも展開することなくそのpackage.jsonを読み取れます.
00:05:19ここまでで約7個のnpmパッケージが不要になりましたが、まだ他にもあります.
00:05:24もっとも、これらはより小さな機能なのでサクサク進めましょう。まず、Bun.serveで静的ファイルを配信できるようになり,
00:05:28serve-staticが不要になりました。これはウェブサイトのpublicフォルダーに最適です.
00:05:33次に、BunがJSON5とXMLのサポートを追加したため、それらの専用パッケージももう必要ありません.
00:05:38Bun内で両方のフォーマットのインポート、パース、文字列化が行えます。最後の3つはターミナル用のヘルパーです.
00:05:43Bun.sliceAnsi、Bun.wrapAnsi、Bun.stringWidthが用意されており,
00:05:47ターミナルの列を意識したスライス、ラップ、計測が可能になり、slice-ansi、cli-truncate、wrap-ansi、string-widthなどのパッケージが不要になります.
00:05:52全体として、約15個のパッケージが不要になりましたが、今回はこのリリース内容の半分ほどしかカバーしていません.
00:05:56このブログ記事の要点をまとめると、多くの処理が高速化され、CPU使用率が改善され、起動が速くなり,
00:06:01これだけの機能が追加されたにもかかわらず、バイナリのサイズは17%小さくなりました。あ、それとRustで書かれています.
00:06:06言及しておくべきボーナス機能として、Bun.installにグローバルな仮想ストアが導入されました.
00:06:10孤立リンカー（isolated linker）を有効にすると、パッケージはマシンの上で一度だけ展開され,
00:06:14個別のプロジェクトごとに別々にコピーされるのではなく、node_modulesにシンボリックリンクされます.
00:06:19これにより高速化が図られ、多くのプロジェクトを抱えている場合には容量の節約にもなります。さて、今のBunについてどう思いますか？
00:06:23使っていますか？これらの機能の中で使ってみたいものはありますか？ぜひ下のコメント欄で教えてください,
00:06:27お待ちしています。チャンネル登録もよろしくお願いします。それではまた、次の動画でお会いしましょう.
00:06:36また次回お会いしましょう.
Community Posts
No posts yet. Be the first to write about this video!
Write about this video