debounce onDocumentChange

packages/xpub-edit/src/components/Editor.js

 import React from 'react'
+import { debounce } from 'lodash'
 import { Editor as SlateEditor, Plain } from 'slate'
 import EditorToolbar from './EditorToolbar'
 
@@ -10,6 +11,12 @@ class Editor extends React.Component {
     state: undefined
   }
 
+  constructor (props) {
+    super(props)
+
+    this.throttledOnDocumentChange = debounce(this.onDocumentChange, 1000)
+  }
+
   componentDidMount () {
     this.deserialize(this.props.value)
   }
@@ -46,8 +53,7 @@ class Editor extends React.Component {
     this.setState({ state })
   }
 
-  // TODO: debouncing?
-  onDocumentChange = (document, state) => {
+    onDocumentChange = (document, state) => {
     const { converter, onDocumentChange } = this.props
 
     if (typeof onDocumentChange === 'function') {
@@ -152,7 +158,7 @@ class Editor extends React.Component {
           onKeyDown={this.onKeyDown}
           onPaste={this.onReceive}
           onDrop={this.onReceive}
-          onDocumentChange={this.onDocumentChange}
+          onDocumentChange={this.throttledOnDocumentChange}
           placeholder={placeholder}
           spellCheck
         />