Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Syntax Highlighting #84

Merged
merged 3 commits into from
Oct 5, 2024
Merged

Add Syntax Highlighting #84

merged 3 commits into from
Oct 5, 2024

Conversation

zephraph
Copy link
Owner

@zephraph zephraph commented Oct 5, 2024

Uses shiki for syntax highlighting. It's not at all doing it how you might expect though. Syntax highlighting is actually performed on val.town via my highlight val.

The process is something like this:

  1. Render the markdown to html
  2. In the markdown middleware, after the response is prepared run cf's HTMLRewriter to find any code blocks that need to be highlighted
    • Hash the source of the codeblock along with the theme and language
    • If that has is in KV, swap it with the html there and return the response
    • Otherwise call out to the highlight val to get the highlighted HTML
    • Write that html to KV (wait until complete, but don't block)
    • Return the result

It's a little complicated from the outset, but I wanted to show off the ability to compose site features that can be edited externally without recompiling the site. An improvement to be made here is when the val itself changes it should bust the cache somehow. Low priority for me, but would be fun.

@zephraph zephraph merged commit d0d237d into main Oct 5, 2024
2 checks passed
@zephraph zephraph deleted the syntax-highlighting branch October 5, 2024 18:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant