{"action":"opened","issue":{"url":"https://api.github.com/repos/joemccann/dillinger/issues/283","labels_url":"https://api.github.com/repos/joemccann/dillinger/issues/283/labels{/name}","comments_url":"https://api.github.com/repos/joemccann/dillinger/issues/283/comments","events_url":"https://api.github.com/repos/joemccann/dillinger/issues/283/events","html_url":"https://github.com/joemccann/dillinger/issues/283","id":54141871,"number":283,"title":"Major performance degradation with multiple code blocks","user":{"login":"owenallenaz","id":1087603,"avatar_url":"https://avatars.githubusercontent.com/u/1087603?v=3","gravatar_id":"","url":"https://api.github.com/users/owenallenaz","html_url":"https://github.com/owenallenaz","followers_url":"https://api.github.com/users/owenallenaz/followers","following_url":"https://api.github.com/users/owenallenaz/following{/other_user}","gists_url":"https://api.github.com/users/owenallenaz/gists{/gist_id}","starred_url":"https://api.github.com/users/owenallenaz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/owenallenaz/subscriptions","organizations_url":"https://api.github.com/users/owenallenaz/orgs","repos_url":"https://api.github.com/users/owenallenaz/repos","events_url":"https://api.github.com/users/owenallenaz/events{/privacy}","received_events_url":"https://api.github.com/users/owenallenaz/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-01-13T02:06:55Z","updated_at":"2015-01-13T02:06:55Z","closed_at":null,"body":"Performance starts to decay massively when working on documents which have code blocks in side them. This makes it really hard to work because you can't see the characters you are typing because the left panel is lagged by the right panel's processing. Here's an exaggerated example that replicates it: [gist](https://gist.github.com/owenallenaz/1e53b36a521a9f02b540). If you copy that into dillinger and attempt to type you'll see what I mean. In my real world example I had a documentation file which only had 20 or so code blocks (but some were 10-20 lines long), and it ground to a halt pretty good.\r\n\r\nFrom looking at the source I see that you are using highlight.js. I ran some tests with that to try and see what the primary culprit was. The primary culprit is the number of the highlighting blocks, but the word count within the blocks also has a large impact. If you have a few blocks with a lot of words, then it will cause it to chug a lot as well, not just a lot of blocks. As the code blocks get larger, things get uglier.\r\n\r\nThere are two kep culprits:\r\n\r\n1. I believe the primary cause of the slowdown is due to due to the `hljs.hightlightAuto` usage in the preview directive. If I switch it to `hljs.highlight()` performance increases a ton ([jsfiddle](http://jsfiddle.net/2e27xz33/)). Becaues markdown often contains the language preference, and `marked` returns a language, using that may solve it for a lot of use cases.\r\n\r\n2. Debounce the right pane. If there is a debounce on the right pane of 200ms then it will allow someone to type fairly quickly, but won't stop the page to render on every key up, only until there is a lull of 200ms between keyups. `ngModelOptions` supports a debounce but I don't know if it's easy to add to this application."}}