Incremental Markdown Preview is a user script that modifies the Stack Exchange live Markdown preview pane to minimize the number of HTML elements that need to be replace every time the preview is updated.
For posts that use a lot of heavyweight features like MathJax, this should provide a significant performance improvement and minimize any flickering of the preview pane. It can also prevent some forms of interactive post content (such as embedded YouTube videos, when used together with SOUP on a site that has them enabled) from resetting whenever a different part of the post is edited.
Other than that, Incremental Markdown Preview should have no visible effects. It just makes editing work better and faster.
Installing
To install Incremental Markdown Preview, you will first need to install a user script manager such as Tampermonkey, Violentmonkey or Greasemonkey.
Once you have a user script manager installed in your browser, clicking the "download / install" button below should bring up a dialog asking you if you want to install Incremental Markdown Preview for Stack Exchange. Answer "yes".
Download / Install Incremental Markdown Preview
Incremental Markdown Preview is hosted as a Gist on GitHub. Note that there is a known bug with Greasemonkey 4 on Firefox that may prevent installation of user scripts from GitHub. Until this bug is fixed, the simplest work-around is to use some other user script manager instead.
Compatibility
Incremental Markdown Preview is intended to be compatible with all modern browsers that support a Greasemonkey / Tampermonkey style user script manager. It requires no external scripts or resources and does not use the GM_* API.
In practice, Incremental Markdown Preview has currently been tested on Chrome and Safari with Tampermonkey and on Firefox with Violentmonkey. I've used it myself for several months on all these browsers with no issues, but I would still welcome more extensive testing on different browsers (especially Edge) and on different Stack Exchange sites with different custom features (like MathJax, syntax highlight, Stack Snippets, etc.). I would also like to learn of any incompatibilities with other popular user scripts.
Eventually, I'm planning to incorporate Incremental Markdown Preview into my Stack Overflow Unofficial Patch (SOUP) user script / extension, and also to submit an equivalent patch directly to Pagedown. Incremental Markdown Preview is designed to be 100% compatible with SOUP, including its embedded YouTube video preview implementation. In fact, that feature was the original motivation for implementing Incremental Markdown Preview.
Incremental Markdown Preview is also meant to be compatible with all Stack Exchange syntax and editing extensions, including MathJax, code syntax highlight and Stack Snippets.
Note that, with Incremental Markdown Preview enabled, changes to "non-local" configuration options like \newcommand in MathJax or <!-- language-all: ... --> in syntax highlight may not immediately propagate to all affected parts of the post being edited. Normally, editing the affected parts of the post directly should be enough to trigger an update. While reports of any other such delayed propagation issues are welcome, they're more or less unavoidable without adding special-case handling to force a full preview pane refresh when such non-local changes are made, which I'm not planning to add in this version of Incremental Markdown Preview.
Stack Snippets have their own HTML caching mechanism that effectively bypasses Incremental Markdown Preview. While this should not cause any actual problems, it does mean that Incremental Markdown Preview provides no real rendering speedup for Stack Snippets, and that all snippets are still reset to their default state whenever the preview pane is updated.
Feedback
If you experience any problems with Incremental Markdown Preview, please let me know about them e.g. by posting a comment or an answer below. Reports of successful and problem-free use are also appreciated, especially on browsers which Incremental Markdown Preview has not previously been tested on.
When reporting an issue, please include the following information (or as much of it as is applicable):
- The browser, OS and user script manager you're using.
- The version of Incremental Markdown Preview you have installed.
- Any other potentially relevant user scripts or browser extensions that you're using (including any Stack Exchange / Stack Overflow specific scripts, as well as any ad blockers, security extensions and extensions that modify page styling or content).
- The Stack Exchange site and page where you experience the issue.
Of course, you should also clearly describe the issue itself (i.e. what happened, what was supposed to happen). It's also helpful if you can give an exlicit list of steps to reproduce the issue or, if you cannot reliably reproduce it, a detailed description of what you were doing when it happened.
If there are any errors or warnings logged into your browser's JS console, those would also be helpful.
Debug logging
Normally, Incremental Markdown Preview logs a message like
incremental markdown preview initialized for #wmd-preview
to the browser's JS console for every preview pane that it detects and patches. This is mainly useful for verifying that the script is actually running.
For extra debugging output, you can edit the code of the script to change logLevel from 1 (the default value) to 2. This will cause Incremental Markdown Preview to log a bunch of diagnostics messages to the console when you edit a post. Those diagnostics messages look something like this:
incremental markdown preview updated #wmd-preview: skipped 32, inserted 0, deleted 0, replaced 1 and recursed into 1 nodes.
These extra log messages are useful for analyzing the performance of Incremental Markdown Preview, but are generally not needed when diagnosing errors.
To disable all logging (other than possible crashes due to bugs), edit the source to set logLevel to 0.
Copyright and License
Incremental Markdown Preview is written by Ilmari Karonen and distributed under the ISC license, a permissive BSD-style open source license.
console.log()calls. :) Actually, I might as well do that myself. It would be nice to replace them with some better (and less spammy) statistics collection method, but I'd have to think a bit more about what stats I actually want to collect.