iPad 网络应用程序。 Javascript，加载所有内容还是切换页面？
我们正在开发一个针对 IPAD 的原型 Web 应用程序。我们充分利用了 HTML5，并且该应用程序运行良好。
部分要求是允许应用程序像本机应用程序一样以流畅的方式在“页面”之间切换。
因此，我们的建议之一是改变网络应用程序的工作方式。目前，该应用程序的工作方式与普通网站非常相似，这在切换到具有大图像或动画的页面时会出现问题（因为它们是在页面切换时加载的）。
是否建议更改我们的应用程序，以便主页只需拖动新内容（通过 AJAX）并相应地操作页面，从而创建所谓的单页应用程序。减少 http 请求的数量和大小？
如果是这种情况，并且我们希望通过 AJAX 加载内容，我们如何确定一旦我们将内容拖入，页面上的每个图像都已加载。这将允许我们在转换发生时使用简单的加载图标。
We are working on a protoype web application, targeted at the IPAD. We have made great use of HTML5 and the app is working well.
Part of the requirement is to allow the app to switch between "Pages" in a fluid motion just like a native app.
So one of our suggestions is to change the way the web-app works. At present the app works much like a normal website, this presents problems when switching to pages with large images or animations (As they are loaded when the page switches).
Is it recommended to change our app so what the home page simply drags the new content (via AJAX) and manipulates the page accordingly, thus creating a so called single page app. Reducing the number and size of the http requests?
If this is the case and we wish to load the content via AJAX, how can we be sure that once we have dragged the content in, each of the images on the page have loaded. This will allow us to use a simple loading icon while the transition is taking place.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
在单页应用程序（SPA）中，请求数量可能不会减少，但它们的大小可能会减少，因为您必须加载脚本并仅查看一次，然后只需更新页面的相关部分。 （当然，通过精心构建的缓存控制标头，多页面设计也可以显着提高速度）。 SPA 范例的好处之一是您可以在初始应用程序加载期间加载多个页面，并在必要时显示它们。因此，您可以权衡初始加载中的一些延迟，以换取后续页面更改时更快的用户体验 - 节省您访问服务器的次数，即使它是“AJAX 之旅”。这是我通常喜欢在 SPA 中做出的权衡。
您可以将内容附加到容器中的 dom，但隐藏它。在所有图像的“加载”事件触发后显示容器。如果您使用 jQuery，可以使用一个插件 https://github.com/alexanderdickson/waitForImages 。如果您使用纯 JS，您可能必须推出自己的解决方案，其中涉及：
numImages) 和初始化一个计数器 (numLoaded) 来记录已加载图像的数量，并numLoaded计数器就会递增，同时numLoaded == numImages。如果为 true，则所有图像均已加载并且可以显示容器。In a single-page app (SPA), the number of requests may not be reduced, but their size may be, b/c you will have to load your scripts and view only once, then just update relevant parts of the page. (Of course, a multi-page design can also have significant speed improvements with carefully-constructed cache-control headers). One benefit of the SPA paradigm is that you can load multiple pages during initial app load, and show them when necessary. Thus, you can trade off some delay in the initial load for a snappier user experience on subsequent page changes - saving yourself a trip to the server, even if it is an "AJAX trip". This is a trade-off that I usually like to make in SPAs.
You could attach the content to the dom in a container, but hide it. Show the container after all of the images' 'load' events have fired. If you use jQuery, a plugin that helps with this is https://github.com/alexanderdickson/waitForImages. If you are using pure JS, you'd probably have to roll your own solution, which would involve:
numImages) and initializing a counter (numLoaded) that tallies the number of loaded images, andnumLoadedcounter is incremented, whilenumLoaded == numImages. If true, all images have loaded and the container can be displayed.