iPhone 4 上的背景图像导致 webapp 运行缓慢
我正在将我的一个项目移植到 iPhone 4。
它是一个 Sencha Touch 应用程序，通过 PhoneGap 包装器（即 UIWebView）运行。一切在 iPhone 3(GS) 和 ofc 模拟器上运行得相当顺利。但在 iPhone 4 上（我们已经在几部手机上进行了测试），面板背景的 css 规则使整个应用程序运行速度非常慢，包括滚动和选项卡转换：
background-image: url(../images/background/main_panel__background.png); /*320x317*/
这会导致所有卡顿和滞后。
我尝试将图像转换为 JPEG 并替换它 - 仍然没有任何帮助。
可能是什么？我知道 WebKit 渲染引擎会进行一些缩放（1x1 -> 2x2）以适应“Retina”显示器的高分辨率，但为什么它会导致如此缓慢？
谢谢。
I'm porting one of my projects to iPhone 4.
It's a Sencha Touch application, running via PhoneGap wrapper (that means UIWebView). Everything runs rather smoothly on iPhone 3(GS) and the simulator ofc. But on iPhone 4 (we've tested on several phones) the css rule for panel background makes the whole app run very slow including scrolling and tab transitions:
background-image: url(../images/background/main_panel__background.png); /*320x317*/
That causes all the stutter and lags.
I've tried to convert the image to JPEG and replace it - still nothing helps.
What could it be? I know that WebKit rendering engine does some scaling (1x1 -> 2x2) to accomodate for high resolution of "Retina" displays, but why would it cause such slowdown?
Thank you.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我发现背景图像存在同样的问题，但我不确定原因是什么。实际上我怀疑我的 png 的 Alpha 导致了这个问题，但显然你也有 jpg 的问题......现在我删除了图片。我们可以使用 CSS 来删除它（仅适用于 iPhone）...
I discovered the same issue with background image and i am not sure what could be the reason. Actually i suspected the Alpha of my png to cause the issue, but apparently you had it with jpg too... For now i remove the picture. We could use CSS to remove it only for iPhones...