| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Name | Name | Last commit date | ||
|---|---|---|---|---|
Render markdown as solid components.
The implementation is 90% shamelessly copied from https://github.com/remarkjs/react-markdown.
Changes include:
Please check the original repo for in-depth details on how to use.
npm install solid-markdownimport { SolidMarkdown } from "solid-markdown";
const markdown = `
# This is a title
- here's
- a
- list
`;
const App = () => {
return <SolidMarkdown children={markdown} />;
};There's an extra option you can pass to the markdown component: renderingStrategy: "memo" | "reconcile".
The default value is "memo", which means that the markdown parser will generate a new full AST tree each time (inside a useMemo), and use that. As a consequence, the full DOM will be re-rendered, even the markdown nodes that haven't changed. (Should be fine 90% of the time).
Using reconcile will switch the strategy to using a solid store with the reconcile function (https://docs.solidjs.com/reference/store-utilities/reconcile). This will diff the previous and next markdown ASTs and only trigger re-renders for the parts that have changed. This will help with cases like streaming partial content and updating the markdown gradually (see #32).
<SolidMarkdown renderingStrategy="reconcile" children={markdown} />;| Back | FazBrowse Home | New Git URL |