FormidableLabs / runpkg

the online javascript package explorer
https://runpkg.com/
MIT License
308 stars 11 forks source link

Markdown handling & marked script handling #181

Open VirtualDOMinic opened 4 years ago

VirtualDOMinic commented 4 years ago

The way runpkg currently works, viewing a markdown (.md) file shows us the formatted version, thanks to the marked markdown parser.

Problems:

  1. Currently there's no way to view the source of a markdown file on runpkg. We just render the formatted version if fileData.extension === 'md' and there's no way to disable this.
  2. In running some lighthouse performance tests, it does seem that - although it's not the heaviest package - loading this script has a noticeable impact on performance metrics like TTI. This seems an unnecessary price to pay when it's likely that most pages viewed are not markdown.
  3. Bonus: is there a particular reason we're using jsdelivr over unpkg to serve this script? If not, it seems in the spirit of this project to move from using https://cdn.jsdelivr.net/npm/marked/marked.min.js to https://unpkg.com/marked@0.8.0/marked.min.js or https://unpkg.com/marked/marked.min.js

Proposals:

  1. Make formatted/source view similar to what we do for prettier. My thoughts would be to a) add a checkbox to toggle formatted/source view, b) add a button similar to the prettier formatting button to format markdown, or c) change the prettier button to be a "format markdown" button when viewing markdown (the same as b, but saving space with the downside of no markdown prettification)
  2. If we tackle proposal 1, we can then defer/async the script
  3. Move to using https://unpkg.com/marked@0.8.0/marked.min.js

Thoughts?