改进的动态WordPress块的服务器端渲染

周末，David Gwyer 宣布了一个自定义服务器端渲染组件 对于块插件。 WPGO插件的共同创始人主要构建其组件是为了加快自己插件中动态块的渲染过程。 但是，他现在已经为WordPress社区中的其他块开发人员发布了此组件。

大多数块是静态的。 它们的输出保持不变，无需更改。 但是，有些块是动态的。 他们的输出需要基于多种原因进行更改，例如它们在WordPress中的输出上下文或其他变化。 例如，核心的“最新帖子”块是动态的，因为它显示的帖子随着新帖子的编写而改变。 如果将它们作为静态块输出，则最终用户每次撰写新帖子时都需要更新该块。 因此，动态块会派上用场，因为它们是由服务器在编辑器和前端中呈现的。

从服务器进行渲染的问题在于，它的速度可能很慢，尤其是当用户对某个特定的块进行多个连续的选项更改时。 每次更改后，都必须重新渲染该块。 动态块的核心体验并不理想。

Gwyer的新组件是 可通过GitHub获得。 该项目的代码很少，其主要JavaScript文件的大小刚好超过4kb（未压缩）。 它引入了一个新的组件，该组件的工作方式与WordPress现有的类似 。 块开发人员切换到该版本进行快速测试应该不会有什么麻烦。

他目前正在使用自己的组件 灵活的常见问题解答 插入。 经过几次测试后，该插件的动态块感觉更加灵敏，几乎达到与JavaScript呈现的静态块之间几乎没有区别的地步。

在编辑器中更新动态块的选项时，实时渲染。

他还计划在他的内部使用它 简单的站点地图 插件和任何其他未来的动态块。 那是假设WordPress在此期间并未改善其服务器端渲染组件。

组件如何工作

Gwyer的组件是核心组件的分支，他说，除了在渲染状态之间进行转换之外，该组件还很不错。 他的自定义组件旨在纠正该问题。 他说：“主要的新增功能是跟踪先前块内容以用作占位符内容的新状态，以及处理微调框位置的新组件属性。”

他列出了核心及其组件如何与核心组件渲染一起工作，如下所示：

1. 渲染块。
2. 块属性已更新。
3. 用微调框替换整个块内容。
4. 渲染新的块内容。

他的新组件进行了重要的更改，至少带来了视觉速度的提升：

1. 渲染块。
2. 块属性已更新。
3. 将整个块内容替换为占位符内容（当前/先前内容），并在右上角加上微调框。
4. 渲染新的块内容。

Gwyer说：“由于块内容基本上保持不变，直到准备好呈现新内容为止，它看起来更快，更流畅。”

真正的问题是，该分叉是否应进入Gutenberg项目并最终合并到WordPress中。 WordPress开发人员Ben Gillbanks如此认为，并创建了一个新的 GitHub票 与请求。

Gwyer说：“我希望看到它添加到Gutenberg中，因为它对于动态块提供了更好的渲染体验。” “如果他们有兴趣将其纳入核心，我很乐意与团队联系。”

像这样：

喜欢加载中……

资源