简体   繁体   English

在移动应用程序的 Javascript 中动态加载图像而不阻塞 UI?

[英]Load images dynamically without blocking UI in Javascript on mobile application?

So I'm attempting to load images in javascript dynamically as the user is scrolling around.所以我试图在用户滚动时动态加载 javascript 中的图像。 The entire application is offline and is written in HTML and javascript.整个应用程序处于离线状态,使用 HTML 和 javascript 编写。 The "scrolling" around behavior is done through CSS3 animations.围绕行为的“滚动”是通过 CSS3 动画完成的。

The problem is that when I set image.src = "foo.png" it blocks the UI until the image has loaded.问题是,当我设置 image.src = "foo.png" 时,它会阻塞 UI,直到图像加载。 Is there a way around this?有没有解决的办法?

How long is the UI being blocked?用户界面被阻止多长时间? If it is local then I wouldn't have thought it much at all.如果它是本地的,那么我根本不会想太多。

Anyhow, the reason the UI may be being blocked is because it needs to download the image to determine its size .无论如何,UI 可能被阻止的原因是因为它需要下载图像以确定其大小 If it doesn't know the image size it will not know how it will affect the layout.如果它不知道图像大小,它将不知道它将如何影响布局。

The first think I would do is to set with and height attributes as soon as the tag is created.我会做的第一个想法是在创建标签后立即设置withheight属性。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM