質問

htmlをPNGのような画像にレンダリングする方法はないでしょうか？canvasで可能なのは知っていますが、例えばdivのような標準的なhtml要素をレンダリングしたいのです。

どのように解決するのですか？

多くの選択肢があり、それぞれに長所と短所があります。

オプション1：APIを使用する

• ApiFlash (クロームベース)
• EvoPDF (htmlのオプションあり)
• グラブジット
• HTML/CSS to Image API
• ...

プロフェッショナル

• Javascriptの実行
• ほぼ完璧なレンダリング
• キャッシュオプションが正しく使用されている場合、高速に動作します。
• スケールはAPIで処理される
• 正確なタイミング、ビューポート、...
• ほとんどの場合、無料プランが提供されています

短所

• たくさん使う予定がある場合は無料ではない

オプション2: 多くの利用可能なライブラリのうちの1つを使用する

• dom-to-image
• イーサネット (wkhtmltopdfツールに含まれる)
• IMGKit (ルビー用で、Monogram をベースにしています)
• イムギキット (Python用、Monogramをベースにしたもの)
• Python-webkit2png
• ...

プロフェッショナル

• 変換が非常に速い

短所

• レンダリングが悪い
• javascriptが実行されない
• 最近のWeb機能（FlexBox、Advanced Selectors、Webfonts、Box Sizing、Media Queriesなど）をサポートしていません。
• インストールが簡単でない場合がある
• スケールアップが複雑

オプション 3: PhantomJs と多分ラッパーライブラリを使用する。

• ファントムジェイズ
• ノードウェブショット (PhantomJsのjavascriptラッパーライブラリ)
• ...

プロフェッショナル

• Javascriptの実行
• かなり速い

短所

• レンダリングが悪い
• 最近のウェブ機能（FlexBox、Advanced Selectors、Webfonts、Box Sizing、Media Queriesなど）に対応していない。
• 拡張が複雑
• 画像を読み込む必要がある場合、動作させるのはそれほど簡単ではありません ...

オプション4: Chrome Headlessとラッパーライブラリを使用する。

• クロームヘッドレス
• chrome-devtools-protocol (クロームデバツールプロトコル)
• パペッティア (Chromeヘッドレス用javascriptラッパーライブラリ)
• ...

プロフェッショナル

• Javascriptの実行
• ほぼ完璧なレンダリング

短所

• 正確に望む結果を得るのはそれほど簡単ではない。
  • ページロードタイミング
  • ビューポート寸法
• 拡大縮小が複雑
• かなり遅く、htmlに外部リンクが含まれる場合はさらに遅くなる

情報開示：私はApiFlashの創始者です。正直で有益な答えを提供するために最善を尽くしました。