wysiwygエディタについての学習7

draft-jsを使ってみる続き

ContentBlock

以下を含む、単一ブロックの不変レコード

• プレーンテキスト
• 型、段落、ヘッダー、リスト
• エンティティ、インラインスタイル、深さ

ContentStateにはContentBlockの注文マップが含まれていて、
それと合わせてエディタの全内容を構成している

スタイルとエンティティの表現

characterListにはcharacterMetaDataのリストが保持される
以下によりメモリフットプリントへの影響を抑えて編集機能を提供できる

• 不変のメタデータ
• データ永続性

メモリフットプリントとは - IT用語辞典 Weblio辞書
http://www.weblio.jp/content/%E3%83%A1%E3%83%A2%E3%83%AA%E3%83%95%E3%83%83%E3%83%88%E3%83%97%E3%83%AA%E3%83%B3%E3%83%88

インラインスタイルとエンティティを一緒にしてエンコード（コード化）することで、
contentBlockでの編集の関数は単一のリストオブジェクトに対してのみ操作すれば良い

イミュータブルにすると速度面で壁を突破できるってことか。まだよくわかってないが面白い。
単一のオブジェクトのみを対象にできるのはメリットか、、
ただ、そのコードを走査する必要があるけど、その辺はメリットの方が大きいんだろうな。
どういうイメージを持てばいいのか。

細かいプロパティの説明は省略。

• Recordはimmutable-jsの方の用語なのね
  • http://facebook.github.io/immutable-js/docs/#/Record/Record

CharacterMetadata

単一文字のインラインスタイルとエンティティを表す不変レコード
characterMetadataは激しくプールされ、共有される
２つの単一文字が、エンティティとインラインスタイルが同じ場合には、同じcharacterMetadataとなる
これにより、使っている文の必要な組み合わせで済むので、メモリフットプリントを節約できる

うーん、なるほど。。グラデーション的なこととかしたらリソース消費激しいってことかな。

このためには、プールを必ず利用するように実装しておく必要がありますが、
コアの処理で実装済みで意識することはありません
ただ、getterメソッドはレンダリング時に便利です

細かいプロパティの説明は省略。

Entity（モジュール）

メタデータでテキストを装飾する情報を保持するエンティティオブジェクトを管理するAPIを含むモジュール
また、単一のストアを持ち、エンティティデータを保持できる

高度な利用方法は別途の記事に記載される
https://draftjs.org/docs/advanced-topics-entities.html

モジュールから作成されるエンティティオブジェクトは、DraftEntityInstance不変レコードとして表される
このインスタンスはシンプルな参照のメソッドを持つ

細かいプロパティの説明は省略。