Add client-side rendering option for Markdown pane based on MyST
This PR adds a new client-side rendering option to the Markdown pane. Specifically you can now set renderer='mystjs' and the Markdown will be transformed into HTML clientside, which has number of benefits:
- The
Markdownvalue can be jslinked with e.g. an editor, without requiring a roundtrip to Python - Markdown generally is less verbose than HTML so it should be more efficient
- Together with the recent support for streaming it should now be even more efficient
Okay, I only just realized mystjs uses an ancient version of myst 😢
Codecov Report
:x: Patch coverage is 28.57143% with 20 lines in your changes missing coverage. Please review.
:white_check_mark: Project coverage is 82.17%. Comparing base (d1754ae) to head (3ac9842).
:warning: Report is 742 commits behind head on main.
| Files with missing lines | Patch % | Lines |
|---|---|---|
| panel/models/myst.py | 0.00% | 18 Missing :warning: |
| panel/pane/markup.py | 80.00% | 2 Missing :warning: |
Additional details and impacted files
@@ Coverage Diff @@
## main #7149 +/- ##
==========================================
- Coverage 82.21% 82.17% -0.04%
==========================================
Files 327 328 +1
Lines 48974 49001 +27
==========================================
+ Hits 40264 40269 +5
- Misses 8710 8732 +22
:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.
:rocket: New features to boost your workflow:
- :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
- :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.
Its a great beginning. A lot of Markdown is probably pretty simple and supported by the ancient version.
We can add a comment or request for an update at the mystjs github.
Also remember to think about if plugins are a thing for mystjs and whether we support it.
Okay, figured it out, this now uses latest myst-parser and myst-to-html + highlight.js for syntax highlighting. Works great, still some alignment on code styling needed but overall I'm quite happy.
Tested with the streaming support and as expected it does zero backtracking now, i.e. it only ever sends the newly added snippets rather than having to go back and modify the previous text.
Also remember to think about if plugins are a thing for mystjs and whether we support it.
Yes, but not really. It's a pretty opinionated Markdown implementation with lots of features supported out-of-the-box.
Have you tested in different templates whether it looks ok?