Webブラウザ上でNode.js環境を実現する「WebContainer」、iOS/iPadOS版Safariに対応。iPhone/iPadでWeb開発環境が起動

今回は「Webブラウザ上でNode.js環境を実現する「WebContainer」、iOS/iPadOS版Safariに対応。iPhone/iPadでWeb開発環境が起動」についてご紹介します。

関連ワード (利用、困難、見分等) についても参考にしながら、ぜひ本記事について議論していってくださいね。

本記事は、Publickey様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


WebAssemblyを用いてWebブラウザ上でNode.js環境を実現する「WebContainer」などを提供するStackBlitzは、WebContainerがiOS/iPadOS 16.4以降のSafariに対応したことを明らかにしました。

iPhoneやiPad上のSafari上で、Node.jsをベースとしたWeb開発環境が起動することになります。

Big news: WebContainers are now supported on Safari, iOS and iPadOS!https://t.co/6SfOUDn4z2 pic.twitter.com/9PykipdNxJ

— StackBlitz (@stackblitz) April 27, 2023

WebContainerはStackBlitzが開発し提供している、Webブラウザ上で実現されるWebAssemblyベースのNode.js環境です(名前に「Container」と付いていますが。Dockerなどのコンテナ技術とは関係ありません)。

Node.jsが備えるJavaScriptランタイムの機能とHTTPサーバの機能などがWebブラウザ上で提供されるため、外部のサーバに依存することなく、Webブラウザ上でnpmによるNode.jsベースのツールチェーンの実行や、Webアプリケーションの開発、テスト、実行などが実現できます。

例えばサーバサイドレンダリングのためのフレームワークであるNext.jsの実行や、GraphQLの実装などがWebブラウザ上で可能だと説明されています。

Webブラウザ上の開発環境はサーバと見分けが付かなくなっていく

これまでWebContainerは、WindowsおよびMacのChromeブラウザ、Firefox(β対応)、Safari(β対応)、Android上のChomeブラウザ(β対応)で実行可能でした。

iOS/iPad OSのSafariについては、過去のバージョンのSafariがJavaScriptの「SharedArrayBuffer」に対応していなかったこと、スタックトレースが他のブラウザ実装と異なること、メモリアロケーションの制限が厳しく、メモリリークのバグも一部で発生することなどから、これまでWebContainerの実行が困難だと説明されていました。

しかしその後iOS/iPadOSのSafariにもSharedArrayBufferが実装され、WebContainer側でも異なるブラウザ実装での解決策を講じ、メモリリークのバグについてはiOS/iPadOSを検知すると別ドメインにリダイレクト後に元のページに戻るという回避策などを組み込み、WebKitの開発者によるバグの解決などの協力も得た結果、iOS/iPadOS 16.4以降のSafariではWebContainerが実行可能となりました。

実際に手元のiPadで試したところ、問題なくWebContainerが起動しました。

fig

WebContainerはStackBlitzのプロダクトとして提供されていますが、個人利用やGitHub上でのパブリックリポジトリを利用した開発は無料となっています。

StackBlitzは2月にWebContainerのAPIも提供を開始しています。Web技術の進化によって、Webブラウザ上で構築される開発環境は、サーバ上で構築されるそれとどんどん見分けが付かなくなっていくようです。

参考:Webブラウザ上でWebAssemblyベースのNode.js環境を実現する「WebContainer」がAPI提供開始。ブラウザ内ファイルシステム、HTTPサーバ、Node.js CLIなど

COMMENTS


Recommended

TITLE
CATEGORY
DATE
マッチングアプリ「Omiai」に不正アクセス 免許証など本人確認書類の写し約171万件が流出した可能性
セキュリティ
2021-05-22 13:16
第4回:顧客体験管理を実現する体制・プラットフォームの作り方
IT関連
2021-03-10 04:57
日本IBM、虎ノ門に事業所を新設–2014年1月に本社を移転へ
IT関連
2023-10-04 14:44
三井不動産、商業施設運営の大規模基幹システムをクラウド化
IT関連
2022-04-14 09:25
日本の行政や企業は「AIのガバナンス欠如」に目を配れ
IT関連
2024-01-19 13:33
弁護士ドットコム、AI搭載の弁護士用書籍検索サービスを発表
IT関連
2023-09-30 14:33
IPA、ウェブサイトの脆弱性対策ガイドを8年ぶりに改訂
IT関連
2021-03-31 10:11
イトーヨーカ堂、人事データベース構築に「COMPANY」を導入–約80%の申請書類削減に期待
IT関連
2022-07-28 22:28
新アプリ「My IIJmio」で他人の情報誤表示 254人に影響
セキュリティ
2021-07-20 10:43
村井純 慶應大教授が説く「リアル空間とサイバー空間の融合が創り出す新たな文明」
IT関連
2022-08-27 22:40
NTT Comとトレンドマイクロ、セキュリティ対策が可能なeSIMを共同開発
IT関連
2022-02-17 04:59
マイクロソフト、「Copilot for Microsoft 365」のプロンプト作成を支援する新機能
IT関連
2024-05-11 09:56
VMware、自宅サーバ愛好家のために「動作保証はないけど動くらしい」非公式ハードウェアリストを作成開始、コミュニティに情報提供を呼びかけ
Docker / コンテナ / 仮想化
2022-03-15 14:52
GitHub、日本・韓国担当シニアディレクターに角田賢治氏
IT関連
2024-03-08 08:26