FEP-c16b: Formatting MFM functions

This is a discussion thread for the proposed fep/fep/c16b/fep-c16b.md at fep-c16b_formatting_mfm_functions - ilja/fep - Codeberg.org

Currently MFM isn’t properly federated in the HTML content field. This results in implementations to always re-parse the MFM source. This proposal is the result of collaboration between Akkoma and Foundkey in order to find a better way to federate this.

In short, we use custom classes and data-* attributes in span elements to provide all needed information.

E.g. $[bounce.speed=0.5s 🐈] is expressed in the content as <span class="mfm-bounce" data-mfm-speed="0.5s">🐈</span>

This makes federation more consistent (content can always be used), and should make for better interoperability (edge-cases in parsing the MFM functions don’t matter any more, and implementations don’t even need to implement a parser for this if they only want to display MFM from remote servers). People still need to implement displaying this, but that is out-of-scope for this proposal. This proposal is purely about translating the MFM function notation into HTML.

There is also a new term defined to indicate that this representation is used.

I’m currently implementing this in Akkoma, see #410 - WIP: Use FEP-c16b: Formatting MFM functions - AkkomaGang/akkoma-fe - Akkoma Development

It’s he first time I write something formal like this, so do be strict so I can learn, but pls be nice :hugs: :heart:

1 Like

Misskey has been using its own Misskey Flavoured Markdown, also known as MFM, as a markup language.

nit: MFM stands for “Markup language For Misskey”, and “Misskey Flavoured Markdown” isn’t an official term.

https://misskey-hub.net/docs/for-users/features/mfm/

Can I suggest using <mfm-X> custom elements instead of <span class='mfm-X'>? I think these have the advantage of being quite easy to allowlist through HTML sanitization logic, and then on the frontend you can simply register HTML custom elements which implement the rendering logic.

This certainly seems like a preferable approach to e.g. doing getElementsByClassName("mfm-X") and then having to do some kind of substitution in order to apply the properties correctly