我正在使用 requireJS
和 jquery/jquery-mobile
开发一个应用程序。现在我正在尝试优化加载和渲染性能。
假设我的应用程序可以分解为 HTML 片段(例如登录表单),它们出现在每个页面上。我的想法是不要在每次请求新页面时都加载代码段。相反,我创建了 HTML 片段(增强标记)的模板版本,并通过 requireJS !text
插件将其引入。
这工作得很好,所以每个片段都需要一次,然后从缓存中获取服务器,因为它已经呈现,所以在第 1 页之后一切都很顺利。
基本上我可以将我的页面原子化
成片段,比如
page { content { form { input & button }}}
并仅按需拉取片段。虽然这最大限度地减少了从服务器加载的内容和渲染时间,但我最终还是得到了大量的 http 请求
。
问题:
非常通用,但是......在构建这样的应用程序时,是否有一种方法可以减少 http 请求的数量?我想我认为 websockets 可以用于此,但我不太确定。很想知道,是否有好的方法可以做到这一点。
谢谢!
最佳答案
所以让我直截了本地说:-
您尝试加快页面加载时间
因此,您将 HTML 文件的内容分解为片段。一些片段,例如 header/footer/login
表单在每个页面上都很常见,这样您只需加载一次并继续从缓存中呈现它们。
但是第一次加载页面时,由于所有这些片段都是单独下载的,因此请求很多。
如果我的理解正确,这就是我的建议。
我建议您在第一个页面加载时实际加载直接从服务器呈现的整个页面。使用 javascript 在加载后添加代码片段可能会很慢。
然后在页面加载时,您可以使用元素选择器将所有呈现的片段的值保存到缓存中。并下载其余的片段。这样,当页面加载时,您有一个(或很少的)请求。当页面已经加载时,所有额外的请求都在后台完成。
关于javascript - 有没有一种方法可以加载模块化 HTML 片段而不必为每个片段触发 http 请求?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12929955/