Question

我有几个Vue.js组件会导致内容在加载时被推到一边。

为了解决这个问题，我创建了一些CSS规则来明确地定位我的Vue组件的自定义HTML标记，如下所示：

custom-tag {
    float: left;
    width: 150px;
    // etc.
}

此示例适用于CustomTag.vue。当Vue.js尚未为相应的Vue.js组件换出此自定义标记时，这将生效。所以这实际上确保我的布局即使没有javascript也是正确的。

虽然这样可行，但这仍然远非一个完美的解决方案。我觉得Vue.js需要很长时间才能生效，即使它被缓存并放入一个只有135KB（gzip）的独立供应商文件中。

我很难为Vue.js找到任何有关此问题的真实解决方案或信息，所以我想知道其他人如何处理这个问题？这是一个问题，因为javascript加载速度不够快或者什么东西？

Answer 1

这很奇怪，但也许有很长的模板，引擎在渲染之前必须编译。

您应该考虑模板的第一次预先处理。如果你在渲染之前在你的html中有自定义标签，我想你不会这样做... 如果可以，请使用single file components。如果你来自React，你也可以找到有用的jsx for Vue，甚至可以手工编写渲染功能（虽然不推荐）。

如果你想完全取消第一次渲染的时间，唯一的方法就是做server-side rendering。因此，您的应用程序将以最初的html结构提供。