私は自分のjsライブラリの使用法を示す例を含むページを書いています。これらの例を編集可能で実行可能にしたいので、次のオプションがあると思いました。
prettifyを使用して、チュートリアルページにコードを表示し、コードを実行できるエディターで新しいウィンドウを開くボタンを用意します（現在実装されているソリューション）。または、エディターをある種のモーダルダイアログにすることもできます。
ページの例ごとに複数のCodeMirrorエディターを使用します（1ページで最大30個になる可能性があります）。それらの編集者がどれほど「重い」かわからないので、それが良い考えかどうかはわかりません。
編集が必要なときにCodeMirrorエディターできれいにされたコードを「スワップ」する編集ボタンを用意して、ユーザーが新しいウィンドウに煩わされることなくサンプルを編集して実行できるようにします。prettifyとCodeMIrrorの構文の強調表示を同じように見せることができるかどうかはわかりません。
これをどのように行うべきか、そしてその理由について何かアイデアはありますか？また、さまざまなコードエディタや構文ハイライターについての提案も受け付けています。そのため、この種の経験をお持ちの方がいらっしゃいましたら、その方法を教えてください。