{"id":3112,"date":"2013-12-27T10:12:35","date_gmt":"2013-12-27T16:12:35","guid":{"rendered":"http:\/\/bililite.com\/blog\/?p=3112"},"modified":"2013-12-27T10:12:35","modified_gmt":"2013-12-27T16:12:35","slug":"debouncing-prism-editor","status":"publish","type":"post","link":"https:\/\/bililite.com\/blog\/2013\/12\/27\/debouncing-prism-editor\/","title":{"rendered":"Debouncing <code>Prism.editor<\/code>"},"content":{"rendered":"<p>Prism is fast, generally fast enough to use for a <a href=\"http:\/\/bililite.com\/blog\/2013\/12\/16\/simple-syntax-highlighting-editor-with-prism\/\" title=\"Simple syntax-highlighting editor with Prism\">live syntax highlighter<\/a>. But for large texts (multiple kilocharacters) having the text re-highlighted with every input bogs down, and I can type faster than the text can show up. I remember old word processors that were like that, back in the dark ages of computerdom. But it's unacceptable today.<\/p>\r\n<p>What I need to do is \"debounce\" the input events, so they aren't piling up and creating a backlog of highlighting that is going to be redone with the next event anyway. <a href=\"http:\/\/unscriptable.com\/2009\/03\/20\/debouncing-javascript-methods\/\">John Hann<\/a> has a nice little routine that I simplified into:<\/p>\r\n<pre><code class=\"language-javascript\" >function debounce (func, threshold){\r\n\tif (!threshold) return func; \/\/ no debouncing\r\n\tvar timeout;\r\n\treturn function(){\r\n\t\tvar self = this, args = arguments;\r\n\t\tclearTimeout(timeout);\r\n\t\ttimeout = setTimeout(function(){\r\n\t\t\tfunc.apply(self, args);\r\n\t\t}, threshold);\r\n\t};\r\n}<\/code><\/pre>\r\n<p>Basically, it uses <code class=\"language-javascript\" >setTimeout<\/code> to delay the application of the function, and resets the timer every time it's called. Use it as <code class=\"language-javascript\" >var debouncedFunc = debounce(func, 100);<\/code>\r\n","protected":false},"excerpt":{"rendered":"Prism is fast, generally fast enough to use for a live syntax highlighter. But for large texts (multiple kilocharacters) having the text re-highlighted with every input bogs down, and I can type faster than the text can show up. I remember old word processors that were like that, back in the dark ages of computerdom. [&hellip;]","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"_links":{"self":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3112"}],"collection":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/comments?post=3112"}],"version-history":[{"count":2,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3112\/revisions"}],"predecessor-version":[{"id":3115,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3112\/revisions\/3115"}],"wp:attachment":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/media?parent=3112"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/categories?post=3112"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/tags?post=3112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}