New in Dart 3.3: Extension Types, JavaScript Interop, and More【日本語訳】

訳者はじめに

FltuterとDartの3ヶ月ごとのバージョンアップに対してブログ記事がありますので、そちらの日本語訳をさせていたただいております。誤訳・改善点があればご連絡いただけると助かります。
こちらはKevin Mooreさんの「New in Dart 3.3: Extension Types, JavaScript Interop, and More」の記事を訳しました。

はじめに

Dart 3.3が登場し、パフォーマンスとクロスプラットフォーム開発が大きく変わりました! 拡張型(Extension Types)を使ってアプリをスーパーチャージし、パフォーマンスの最適化とネイティブコードとのやり取りを革新しましょう。さらに、改良されたJavaScriptとの相互運用モデルは、堅牢な型安全性と、Webプラットフォームの力を活用するための開発者に優しい方法を導入します。これらはすべて、WebAssemblyのサポートへの道を開きます。ああ、そしてあなたのDartアプリにGoogle AIを?どうぞ!Dart 3.3には、そのすべてが詰まっています。さっそく見ていきましょう!

拡張型の紹介

拡張型は、型のためのゼロコストラッパーを導入します。ホストプラットフォームとの相互運用時に特に、パフォーマンスに敏感なコードを最適化するためにそれらを使用します。拡張型は、特定のメンバーを持つカスタム型の便利さを提供しながら、典型的なラッパー割り当てのオーバーヘッドを排除します。

extension type Wrapper(int i) {
  void showValue() {
    print('my value is $i');
  }
}

void main() {
  final wrapper = Wrapper(42);
  wrapper.showValue();
}

前述の例では、Wrapperを拡張型として定義していますが、通常のDart型のように使用します。それをインスタンス化して関数を呼び出すことができます。Dartがそれを通常のDart intとしてコンパイルするという主な違いです。拡張型は、間接コストのある典型的なラッパータイプを割り当てることなく、ユニークなメンバーを持つタイプを作成する便利さを可能にします。したがって、拡張メンバー機能(Dart 2.7以降で利用可能)は、既存のタイプに関数とプロパティを追加することができますが、拡張型機能は同じことができるだけでなく、基礎となる表現を隠す新しいAPIを定義することもできます。

これは、ホストプラットフォームとの相互運用性に特に便利です。ネイティブタイプをラッパーを作成し、間接性と関連するコストなしに直接使用できますが、それでもクリーンな、本番用のDart APIを提供します。拡張型に関する新しいドキュメントで詳細を学びましょう。

JavaScriptとの相互運用性の進化

Dart 3.3は、JavaScriptライブラリとWebとの相互運用のための新しいモデルを導入します。それは、JavaScriptとのやり取りのための新しいAPIセット、dart:js_interopライブラリから始まります。これでDart開発者は、JavaScriptとのやり取りのための型付きAPIにアクセスできます。このAPIは、2つの言語間の境界を静的な強制力で明確に定義します。これにより、コンパイル時間前に全クラスの問題を排除します。JavaScriptコードへの新しいAPIへのアクセスに加えて、Dartは拡張型を使用してDart内のJavaScriptタイプを表すための新しいモデルを含んでいます。

import 'dart:js_interop';

extension type MyConsole(JSObject _) implements JSObject {
  external void log(JSAny? value);
  external void debug(JSAny? value);
  external void info(JSAny? value);
  external void warn(JSAny? value);
}

拡張型に基づく構文は、拡張メンバーよりも表現力と健全性を可能にします。これにより、DartからJavaScript APIを利用することが簡単になります。JS相互運用に関する新しいドキュメントで詳細を学びましょう。

ブラウザライブラリの改善

バージョン1.0以来、Dart SDKには、dart:htmlライブラリを含む、SVG、WebGLなどのライブラリの包括的なセットが含まれています。

改良されたJavaScript相互運用モデルは、これらのライブラリを再考する機会を提供しました。今後、私たちのブラウザライブラリサポートは、package:webに焦点を当てます。これにより、バージョニングが簡素化され、更新が加速され、MDNリソースとの整合性が保たれます。

この改良の連鎖は、次の大きな出来事、つまりDartをWebAssemblyにコンパイルすることにつながる。

今日からWebAssemblyの未来を有効にする

Dart 3.3では、WebAssemblyにコンパイルされたWebアプリケーションの基盤を築くことができます。Flutter WebでのWebAssemblyサポートはまだ実験的ですが、チームは実装の安定化に努めています。WebAssemblyを使用してWeb上でFlutterアプリケーションを実行するには、アプリケーションとすべての依存関係からのすべてのコードを、新しいJavaScript相互運用メカニズムとpackage:webを使用して移行する必要があります。古いJavaScriptとブラウザライブラリは、JavaScriptコードへのコンパイルのために変更されずにサポートされ続けます。しかし、WebAssemblyへのコンパイルには移行が必要です。

Wasmを含むための移行ガイドを作成しました。安定版リリースに含める時までに、最も人気のあるパッケージがWasmをサポートしていることを願っています。

もう一つのこと: Google AI Dart SDKの紹介

Googleは、Google AI Dart SDKをベータ版としてリリースしました。DartまたはFlutterアプリに生成AI機能を組み込むことができます。これらのアプリは、Googleの最新のAIモデルファミリーであるGeminiを使用します。package:google_generative_aiを見て、このブログ投稿でGoogle AI Dart SDKを使ったビルド方法を学ぶか、クイックスタートに直接飛び込んでください。