#
714
2026/5/5
今日のトレンド

C#とブラウザ自作の魅力

おはようございます。マイクです。
「zenncast」今日も元気にお届けしていきます。
今日は2026年5月6日、水曜日の朝7時台ですね。みなさんいかがお過ごしでしょうか。通勤通学中の方も、おうちで支度中の方も、ちょっとだけ耳を貸してもらえたらうれしいです。
この時間は、Zennで今日トレンドの記事をピックアップしてご紹介していきます。

さて、今日はお便り……は、ちょっとお休みですね。番組の感想や、紹介してほしい技術テーマなんか、ぜひ気軽に送ってください。

今日は全部で5本の記事をご紹介します。C#、AIアシスタント、セキュリティ、数式レンダリングと、かなりバラエティ豊かなラインナップになってますよ。

まず1本目。
タイトルは「C#でJavaScriptEngine+ブラウザ自作した」。
いやー、これ読んで一言、「個人でここまでやる時代なのか…」って、軽くめまいがしましたね。
筆者の方は、まずC#でECMAScript準拠のJavaScriptエンジン「Okojo」を実装して、その上にNode風のランタイム、さらにReactのレンダラー、HTML/CSSのレイアウトエンジンにSkiaSharpの描画層を積み重ねて、最終的に「Enaga」という独自ブラウザまで作っちゃってます。WebViewに頼らない、フルスクラッチ寄りのブラウザです。

HTTP通信まわりも、用途別にHttpClientを分けていたり、実サイトとちゃんとつながるようにヘッダや文字コード判定、CSSやJavaScriptの解決までかなり現実的な実装をしています。JavaScriptの値の表現は、NaN-boxing風の`JsValue`とshapeベースの`JsObject`で高速化していて、RealmとかAgentといった仕様用語も、ちゃんと仕様寄りに作り込んでいるのがすごい。

DOMはC#側のモデルと、JavaScript側のラッパーをnode idで結びつけて、部分的なレイアウト更新にも対応。HTML/CSSは独自のシーングラフに落としてからSkiaSharpで描画するので、OpenGL、Vulkan、Metalといったバックエンドにも対応できます。入力イベントも、シーングラフ上でヒットテストしてDOMやJSに戻し、日本語入力はWindowsのIMM32とmacOSのCocoaを直接触って統合しているという、ガチ実装。

とはいえ、動画やcanvas / WebGL、WASM、Service Worker、IndexedDB、セキュリティポリシーなど、ブラウザの機能を全部はカバーしていないので、さすがに「本番ブラウザ互換」とまでは行っていません。ただ、test262みたいなテスト環境やツールも整えつつ、AIをうまく活用して大胆に書き直しながら前に進むスタイルが書かれていて、「今は個人でもここまでのブラウザを作れる時代だなあ」と感じさせてくれる、夢のある記事でした。ブラウザや言語処理系が好きな人は、読むとかなり刺激を受けると思います。

。。.。。.。。

続いて2本目。
タイトルは「【C#】CSharpierのすすめ」。
これはC#を書いている開発者さん向けの、フォーマッタのお話です。

みなさん、C#のコード整形って、何使ってますか?標準だと「dotnet-format」が有名なんですが、この記事の筆者は、メソッドチェーンの折り返しだったり、空白行の扱いだったりに不満があって、しかもパフォーマンスもそこまで速くない、というモヤモヤを抱えていたそうです。

そこで出てくるのが「CSharpier」。名前からしてちょっとおしゃれな感じですけど、Prettierに影響を受けた、サードパーティ製の高速C#フォーマッタです。Roslynベースで実装されていて、「意見の強いフォーマッタ」として、細かいスタイル設定をあえて最小限に抑え、プロジェクト全体で統一感のあるキレイなコードを出すことに振り切っています。

導入は、`dotnet tool install csharpier -g` みたいな感じでグローバルツールとして入れて、`csharpier format .` で一気に整形。設定は`.csharpierrc`や`.editorconfig`で変えられるんですが、筆者曰く、基本はデフォルトで十分。IDE用の拡張もあって、保存時の自動フォーマットにも対応しているので、「とりあえず入れてみるか」がしやすいツールですね。

コードスタイルって、チーム内で議論し始めると終わらなくなりがちなんですが、「もうフォーマッタの言うことに従おう!」と割り切れると、だいぶ気が楽になります。dotnet-formatにモヤっとしてるC#勢の方は、一度試してみてもいいかもしれません。

。。.。。.。。

3本目。
タイトルは「Claude CodeユーザーのためのCodex入門」。
AI開発アシスタントまわりで、最近よく耳にするキーワードがふたつ出てきましたね。Claude CodeとCodex。

この記事は、これまでClaude Codeに慣れ親しんできた開発者が、「そろそろCodexも本格的に触ってみるか」というときに、どこがどう違うのか、どこに気をつければいいのかを整理してくれている内容です。背景として、GPT-5.4〜5.5あたりで、コード生成や補完の面でClaudeよりCodexの方が良さそうだ、という声が増えてきていることや、料金あたりでたくさん使えること、ツールやUI/UXが充実してきたことが紹介されています。

使い方としては、CLIゴリゴリよりも「Codex App」を使うのが一般的で、設定UIもかなりしっかりしているとのこと。料金プランは、そこそこ以上に使うならPlusかProが現実的で、GPT-5.5をガンガン使うならPro、コスパ重視ならPlusでGPT-5.4中心、という住み分けがわかりやすく書かれています。

Claudeにある「Permissionモード」に相当する概念も紹介されていて、Codex側ではapproval、plan、reviewer、sandboxといった要素に分かれています。Codex Appでは、これを「デフォルト権限」「自動レビュー」「フルアクセス+planのON/OFF」くらいに簡略化して操作できるので、「とりあえず安全に試したい」「一部だけ自動実行を許可したい」みたいなニーズに合わせて設定が可能です。

設定ファイルは、グローバルとプロジェクトごとの`config.toml`、それから`.rules`ファイルで管理して、どのモデルを使うか、どのMCPやコマンドを許可するか、allow / prompt / forbiddenの3段階でコントロールできます。スマホからの公式なリモート操作は、まだあまり整っていないものの、サブスク範囲でサードパーティ製ツールがいろいろ使えるので、筆者は自作の「CC Pocket」というツールも紹介していました。

Claude CodeからCodexに乗り換えようかな、併用しようかな、という人にとっては、違いを一気に俯瞰できる、すごく良いガイドになっている記事です。

。。.。。.。。

4本目。
タイトルは「『管理手順から外れて誤ってGitHubに保管』— マネーフォワード第二報から考える、本番データ混入を仕組みで止める方法」。
これは、ちょっとヒヤッとするけど、大事な話です。

マネーフォワードさんのインシデント報告で、「本来の管理手順から外れ誤ってGitHubに保管」という一文が出てきたことをきっかけに、「本番データが、正規のルートじゃない形でリポジトリに混ざってしまう典型パターン」と、その防止策を整理しています。

混入要因として挙げられているのは主に3つ。
1つ目が、デバッグや障害調査のときに、本番データをリポジトリ配下に落としてしまうパターン。
2つ目が、マイグレーションスクリプトやデータパッチに、本番由来のデータをそのまま書いちゃうケース。
3つ目が、テストフィクスチャやE2Eテストのシードデータに、本番データを流用するパターン。

しかも、個人情報って、シークレットスキャナやPRレビューだと見落としやすかったり、プライベートリポジトリだからといって、漏えい時の「最後の砦」にはならなかったりするんですよね。

この記事では、「人ががんばる」じゃなくて、仕組みで止めることを強く提案しています。
具体的には、4つのレイヤーで守るイメージです。
1つ目、本番から開発環境にデータを持ってくるルートには、必ずマスキングを挟んで、そもそも生データを渡さない。
2つ目、pre-commitフックでCSVやSQL、大容量ファイル、典型的な個人情報パターンをブロックする。
3つ目、CIでも同様のスキャンを再実行して、「ローカルでフック外したから…」を許さない。
4つ目、過去のGit履歴を定期的にスキャンして、棚卸ししていく。

ポイントは、「人は例外対応や時間に追われると、必ず手順を飛ばす」という前提に立つこと。そのうえで、「手順を飛ばしたくても物理的にできない」ような構造をつくるのが本質だ、としています。記事では、CSVコミット時の正規ルートをどう定義するか、みたいなチェックリストも提示されていて、すぐに社内で議論のたたき台にできそうな内容でした。

。。.。。.。।

そして最後、5本目。
タイトルは「RaTeX(Pure Rust × WASM)で数式をWebに表示する」。
これは、数式いっぱいのページをWebでちゃんと表示したい人には、かなりうれしい話題です。

「RaTeX」は、Pure Rustで作られた、KaTeX互換の数式レンダラーです。WASMとしてブラウザ上で動作して、`<ratex-formula>` というWeb Componentsを通じて、LaTeXの数式をcanvasに描画できます。KaTeXの構文にほぼ対応していて、化学式の`\ce{}`や、単位表現の`\pu{}`も扱えるので、数学だけじゃなくて物理・化学系の表現にも強いのが特徴です。

導入方法もわりとお手軽で、CDNからCSSとJavaScriptを読み込むだけ。ただし注意点として、フォントが読み込まれる前に描画してしまうと文字化けしがちなので、`document.fonts.load()`などを使って、フォントがちゃんと読み込まれたあとにDOMから`<ratex-formula>`を動的に生成する、という運用が推奨されています。

デモには、数学・物理・化学の代表的な数式が37種類ずらっと載っていて、「自分が使うやつ、だいたいあるな」という安心感があります。さらにRust製のCLIツール「ratex-pdf」を使えば、数式単体のPDFを生成したり、見出し・本文・`$$数式$$`で構成した`document.txt`形式と、Pythonスクリプト+fpdf2を組み合わせて、文章と数式が混ざったPDFドキュメントも作れるようになっています。

フォント周りでちょっとしたコツは必要ですが、「静的HTMLに数式を埋め込みたい」「そこまで大げさな環境は用意したくない」という人にとって、Rust×WASMな新しい選択肢として、かなり魅力的なプロジェクトだなと感じました。

。。.。。.。。

というわけで、今日は5本の記事をご紹介しました。
C#でJavaScriptエンジンと自作ブラウザを作ってしまった話、CSharpierというC#向けフォーマッタのススメ、Claude CodeからCodexに移るときの入門ガイド、本番データのGitHub混入を仕組みで防ぐ方法、そしてRust×WASMな数式レンダラーRaTeXの紹介でした。

気になった記事があれば、ぜひ実際の本文もチェックしてみてください。詳しい内容や記事のリンクは、この番組のショーノートにまとめておきます。

「zenncast」では、番組の感想や、「こんなテーマを取り上げてほしい」「この技術つまずいてます」みたいなお便りも、どしどしお待ちしています。日々の開発の愚痴なんかも大歓迎です。

それでは、そろそろお別れの時間です。
今日も良い一日をお過ごしください。お相手はマイクでした。
また次回の「zenncast」でお会いしましょう。

Related episodes

内容の近いエピソードを推薦しています