MicroLighter：CSS Custom Highlights API を使った軽量シンタックスハイライター
Introducing MicroLighter
Dave Rupert氏は、CSS Custom Highlights APIを利用したクライアントサイドのシンタックスハイライター「MicroLighter」を公開しました。依存関係ゼロ、gzip後約2KB、Textmateの言語グラマーを活用し、言語ごとにオンデマンドで読み込むのが特徴です。従来のspanタグによるDOM操作を避け、CSSの::highlight疑似要素でトークンをハイライトします。また、ライト/ダークテーマをlight-dark()で統合し、行番号などの追加機能はカスタム要素に分離しています。
CSSの::highlight()疑似要素には制限があります。イタリック、太字、フォントの切り替えはできませんが、それ以外は、spanをあちこちに注入する代わりにCSSで「このトークンをハイライトしたい」と慣用的に表現できる、かなりクールな構文です。