Skip to content

Best approach for dynamic block rendering in the editor #28684

@tellthemachines

Description

@tellthemachines

What problem does this address?

Currently, core dynamic blocks use one of two different approaches to rendering in the editor:

  • server-side rendering with ServerSideRender, which reproduces the markup defined in the block's index.php (e.g. Archives, Latest Comments)
  • client-side rendering with the REST API and reconstructing the markup defined in index.php in JS. (e.g. Categories, Latest Posts)

The developer docs recommend client-side rendering:

Server-side render is meant as a fallback; client-side rendering in JavaScript is always preferred (client rendering is faster and allows better editor manipulation)

However, it's not clear that client-side rendering does in fact work better:

  • Performance-wise, blocks using ServerSideRender load faster than blocks using JS to render the same amount of content.
  • Duplication of markup between PHP and JS files makes things messy to maintain and error-prone.

What is your proposed solution?

I'd love to see us leverage ServerSideRender on all our dynamic blocks, but in order to do so we'll need to improve it:

  • It shouldn't have to wrap its content in an extra piece of markup;
  • It should be able to work with block context (this will also require changes to the REST API endpoint)

Thoughts and ideas welcome!

(This issue was prompted by work on #28265 , where I opted to use to use ServerSideRender but ran into the issue of not being able to use block context to customise markup output.)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions