コンテンツ作成は、Web の初期から中核でした。の<textarea>ほぼすべての Web アプリケーションにネイティブで不可欠なソリューションを提供します。ただし、ある時点で、テキスト入力に書式設定を追加する必要がある場合があります。ここでリッチ テキスト エディターが役に立ちます。選択できるソリューションは数多くありますが、Quill は考慮すべき最新のアイデアをいくつか提供します。
リッチ テキスト エディターは、テキストの作成を支援するために構築されています。しかし驚くべきことに、ほとんどのリッチ テキスト エディタはユーザーがどのようなテキストを作成したかを知りません。これらの編集者は、Web 開発者と同じレンズ、つまり DOM を通してコンテンツを見ます。 DOM は不均衡なツリーに編成されたノードで構成されているのに対し、テキストは行、単語、文字で構成されているため、これによりインピーダンスの不一致が生じます。
文字を単位とする DOM API はありません。この制限により、ほとんどのリッチ テキスト エディターは、「この範囲に含まれるテキストは何ですか?」などの単純な質問に答えることができません。または「カーソルは太字のテキスト上にありますか?」このようなプリミティブの上に豊かな編集エクスペリエンスを構築しようとすることは非常に難しく、イライラさせられます。
Quill は編集と文字を念頭に置いて設計されており、これらの自然テキスト中心のユニットの上に API を構築しました。何かが太字かどうかを確認するために、Quill は DOM を走査して太字を探す必要はありません。<b>また<strong>ノードまたはフォントの太さのスタイル属性 - を呼び出すだけですgetFormat(5, 1)。その核心すべてAPI呼び出しでは、アクセスまたは変更のために任意のインデックスと長さを許可します。これはイベントAPIまた、直感的な JSON 形式で変更をレポートします。 HTML を解析したり、DOM ツリーの差分を調べたりする必要はありません。
リッチ テキスト エディターの評価が、必要な形式のチェックリストを比較するだけで簡単になったのは、それほど昔のことではありません。優れたリッチ テキスト エディターの特徴は、単にサポートされている形式の数でした。これは依然として重要な尺度ですが、下限は無限大に近づいています。
テキストは印刷するために書かれなくなりました。これは、紙よりもはるかにリッチなキャンバスである Web 上でレンダリングされるように書かれています。コンテンツはライブ、インタラクティブ、さらには共同的なものにすることができます。画像やビデオなどの単純なメディアさえサポートできるのは、一部のリッチ テキスト エディタだけです。ツイートやインタラクティブなグラフを埋め込めるものはほとんどありません。しかし、これが Web の進む方向です。つまり、よりリッチでインタラクティブです。コンテンツ作成をサポートするツールは、これらの使用例を考慮する必要があります。
Quill は、DOM に対する強力な抽象化である独自のドキュメント モデルを公開し、拡張とカスタマイズを可能にします。 Quill がサポートできる形式とコンテンツの上限は無制限です。ユーザーはすでにこれを使用して、埋め込みスライドデッキ、インタラクティブなチェックリスト、3D モデルを追加しています。
クロスプラットフォームのサポートは多くの Javascript ライブラリにとって重要ですが、これが何を意味するかの基準は異なることがよくあります。 Quill にとって、バーは単に実行または機能するだけではなく、実行または機能する必要があります。同じ方法。クロスプラットフォームでは機能だけでなく、ユーザーと開発者のエクスペリエンスも考慮する必要があります。一部のコンテンツが OSX 上の Chrome で特定のマークアップを生成する場合、IE でも同じマークアップが生成されます。 Windows 上の Firefox で Enter キーを押すと太字形式の状態が保持される場合、モバイル Safari でも保持されます。
これらの利点はすべて、使いやすいパッケージで提供されます。 Quill には、ほんの数行の Javascript ですぐに使用できる適切なデフォルトが同梱されています。
var quill = new Quill('#editor', {
modules: { toolbar: true },
theme: 'snow'
});
アプリケーションが要求しない場合は、Quill をカスタマイズする必要はありません。すぐに提供されるリッチで一貫したエクスペリエンスを楽しむだけです。
楽しみ！