Javascript 基于restapi的web应用动态部分_Javascript_Jquery_Rest_Template Engine

Javascript 基于restapi的web应用动态部分

javascript jquery rest

Javascript 基于restapi的web应用动态部分,javascript,jquery,rest,template-engine,Javascript,Jquery,Rest,Template Engine,我们有一个web应用程序，它发送RESTAPI请求，并在请求完成后更改DOM。这一切都是在jQuery中通过AJAX调用完成的。但问题是，页面的所有动态部分在页面刷新时都会有一点延迟才能得到更新。这就像你首先看到静态元素，然后立即更新。这很明显我们等待$（document）.ready，所以我认为这就是问题所在。有没有更好的方法在呈现HTML之前更新它，这样用户就不会注意到更改更不用说，大部分数据都缓存在sessionStorage中，因此无需REST调用即可读取我搜索了一点，但我不太确定

我们有一个web应用程序，它发送RESTAPI请求，并在请求完成后更改DOM。这一切都是在jQuery中通过AJAX调用完成的。但问题是，页面的所有动态部分在页面刷新时都会有一点延迟才能得到更新。这就像你首先看到静态元素，然后立即更新。这很明显

我们等待

$（document）.ready

，所以我认为这就是问题所在。有没有更好的方法在呈现HTML之前更新它，这样用户就不会注意到更改

更不用说，大部分数据都缓存在

sessionStorage

中，因此无需REST调用即可读取

我搜索了一点，但我不太确定，我需要一个客户端模板引擎吗？像

Mustache.js

？

我认为不可能完全避免ajax请求造成的延迟。您可以从$（文档）中提出一些请求。准备好并将其放在标题部分：

<head>
   <script type="text/javascript" src="jquery.js"></script>
   <script type="text/javascript">
       // some javascipt here, $.getJSON etc.
   </script>
</head>


//这里有一些javascipt，$.getJSON等。

在这种情况下，您必须注意选择尚未渲染的元素（这可能会导致一些不愉快的错误）

最后，我建议您使用一些加载gif和加载元素的动画，以增加用户体验。以AngularJS及其动画功能为例：

如果您所担心的只是页面更新时的明显变化，那么您可以将body标签中的所有内容都放在容器div中，并将其显示为

无。在页面加载时显示加载图像，然后在Ajax请求完成时显示容器div。
在收到数据后如何呈现html不会改变异步Ajax延迟问题。如果数据已经在存储中，这将产生巨大的影响though@charlietfl，正如我所说，数据缓存在sessionStorage
中。因此，对于初始加载，可以看到延迟，但即使在我从会话存储
读取时，我仍然看到问题。请记住，您可以在文档准备就绪之前从存储中获取数据。在加载DOM之前，您将无法渲染它，但如果数据较大，则可能会缩短一些时间。如果更改后在文档之前获取数据仍有延迟。就绪
则您的问题可能在于渲染代码，所以，请把它贴在小提琴上的某个地方，这样我们就可以看一看了。默认情况下，使用一个模态，并在渲染后隐藏它。