Discussion on: Shortcodes vs MDX

[Knut Melvær]

Thanks for this post @swyx !

I agree with you that MDX is best for writing React pages. And would add, by people who are into writing JSX in their prose. Even as a longtime Markdown user and React-focused dev, I don't like to write prose in MDX. But that's like, my opinion.

[disclaimer: I'll now write about technologies that come out of my team]

I believe that specs like Portable Text are an alternative, and in many cases the alternative to markup syntax and shortcodes. It makes sense to group it together with block-based systems like Gutenberg and Notion, but a crucial difference is exactly portability. PT is designed to be serialized into any markup language or framework, also non-HTML-based ones. A couple of the other attempts, like Gutenberg, will be harder to take out of the WordPress ecosystem because of the specific assumptions baked into the specification. With a presentation agnostic specification, you can build Speech-Synthesis Editors and whatnot. And better, you can query your rich-text with something like GROQ.

I wrote a whole post discussing my hesitations with MDX. Interestingly, it was easy to import to dev.to by converting Portable Text to Markdown. The only custom code I needed was pretty much this:

const serializers = {
  types: {
    code: ({ node }) => `\`\`\`${node.language}\n${node.code}\n\`\`\``,
  }
};

const markdownBody = PT2Markdown(blocks, {serializers})