移动端后台预加载HTML页面，setTimeout定时器线程跑完问题

最新推荐文章于 2025-04-11 17:12:24 发布
原创 最新推荐文章于 2025-04-11 17:12:24 发布 · 1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

在兼容iOS8时，发现页面后台加载完成，计时器即开始运行。通过加入setInterval和document.hidden检测，每2秒检查页面状态，转到前台时结束Interval，有效解决此问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在兼容IOS8的时候遇到一个有趣的问题：

IOS预加载了页面，在页面中我写入了一个setTimeout（差容、缓冲的作用），其作用是为了兼容老版本的设备无Hybird交互仍然能使用功能。

结果发现，页面后台加载完，计时器线程便开始跑了，这让我满头黑线

于是我加入的setInterval、documen.hidden（页面前台状态为false，后台状态为true），让它每隔2秒检测一次情况

转为前台状态的时候结束Interval线程

这样解决了该问题

【白嫖党】如何把前端学好？看完这篇，直呼：太强了！（历经半个月之作）
超逸の学习技术博客
04-04 2万+
很少有文章做到将知识形成一个体系，于是需要翻阅很多资料，但这篇文章做到了！共34815字数。
实战解决小程序图片加载问题
热门推荐
夏尔的小酒馆
10-11 4万+
相较于web端或者H5开发，小程序本身在性能上弱很多（但用户体验上要好）。以前开发时服务器性能过剩在那里帮你撑着脸面，你对自己的代码质量和编程习惯心里没数，小程序就是一面镜子。 废话少说，要解决的问题是，小程序加载图片闪烁，渐渐出现，出现的很慢等等效果不尽人意的体验。 如果你的小程序本身只用加载很少的图片，那么其实问题不大。如果是像购物APP那样或者是一款有图片列表的应用，那么以下方案肯定能帮到你...
setTimeout 浏览器进入后台时不被冷却的方法
352328759的博客
01-19 4016
出于节能的考虑, 部分浏览器在进入后台时(或者失去焦点时), 会将 setTimeout 等定时任务暂停 待用户回到浏览器时, 才会重新激活定时任务 说是暂停, 其实应该说是延迟, 1s 的任务延迟到 2s, 2s 的延迟到 5s, 实际情况因浏览器而异 在 Chrome 中运行一下代码 var t = new Date() * 1 function fun1() { var _t = new Date() * 1 console.log(_t - t) t = _t setTimeout(fun
【移动端debug-4】iOS下setTimeout无法触发focus事件的解决方案
weixin_30448685的博客
04-22 481
开篇总结：其实目前无法解决这个bug。 这两天做项目遇到了这个case，项目需求是打开页面的时候，input元素自动弹起键盘。由于各种方面的考虑，我们希望通过setTimeout延时200毫秒让input元素focus，demo代码如下： <!doctype html> <html lang="en"> <head> <meta ch...
setTimeout小尴尬的启示
奇舞周刊
08-05 197
编者按：本文作者李松峰，资深技术图书译者，翻译出版过40余部技术及交互设计专著，现任360奇舞团Web前端开发资深专家，360前端技术委员会委员、W3C AC代表。本文通...
iOS 定时器的使用 在后台运行定时器
冰凉的枷锁的博客
04-28 2450
1.在APPDelegate的didFinishLaunchingWithOptions中设置 [session setCategory:AVAudioSessionCategoryPlayback error:nil]; [[AVAudioSession sharedInstance] setActive:NO withOptions:AVAudioSessionSetActiveOptionN...
java后台定时器最简单用法实例，类似于js里的setTimeOut
08-26
java后台定时器最简单用法实例，类似于js里的setTimeOut
Js中setTimeout()和setInterval() 何时被调用执行的用法
12-11
例如，以下代码会在页面加载2秒后弹出一个警告框： ```javascript setTimeout(function() { alert('Delayed alert!'); }, 2000); ``` `setInterval()`函数则用于周期性地执行某个函数，直到被`clearInterval()`...
HarmonyOS 开发实践——基于Web组件的H5页面切换类点击操作响应时延问题分析思路&案例
liuhaojiabin的博客
11-06 724
应用或元服务内点击操作响应时延应 ≤ X时间起点：点击离手；时间终点：界面发生变化。S标A标B标100ms150ms250ms自研应用、三方应用、底线S标（误差5%以内）响应起点：手指点击抬手离开屏幕响应终点：肉眼看到屏幕变化的第一帧响应时延：两处时间差值。
【快速渲染技术要点】：Webview加载H5页面的优化策略与实践
Webview是一个允许网页内容在移动应用内展示的界面组件，它承载着H5页面的加载和渲染，是移动应用与网页之间交互的桥梁。在第一章中，我们将探究Webview的基本工作原理，以及它如何加载和渲染H5页面，为后续章节深入...
移动端开发--页面预加载
ailong3046的博客
09-17 355
　　　　这两天一直困扰我的一个问题终于解决了。很感谢同事给我的帮助。 　　　　先说下我遇到的问题：在app首次安装或者用户清除本地缓存信息后，用户再次登陆后，虽然可以从缓存中获取到用户信息，但是，放不到页面上。我一直很奇怪为什么会出现这样怪异的事。 　　　　总结一下出现上述这种情况的原因：1、lantch页面设置成index页，而不是登陆页，在用户首次安装index页的时候，其实已经...
调度：setTimeout 和 setInterval
2301_76153828的博客
01-30 699
setTimeout(func, delay, …args) 和 setInterval(func, delay, …args) 方法允许我们在 delay 毫秒之后运行 func 一次或以 delay 毫秒为时间间隔周期性运行 func。要取消函数的执行，我们应该调用 clearInterval/clearTimeout，并将 setInterval/setTimeout 返回的值作为入参传入。
java+h5移动端熄屏后台会挂起，js会停止运行，settimeout不生效
期待变成大神的博客
11-19 3257
移动端app需求：多个定时提醒 尝试一：前台抛出settimeout时间到了自动执行 结果：短时间1，2分钟的可以执行，长时间时间就会有误差。 刚开始以为是多个定时器之间互相影响的，后来发现只有退出到主页面或熄屏时才会出现这种问题 好吧，查资料说是这种状态后台会挂起，settimeout暂停运行，等再次回到系统会继续执行。 按照这个逻辑那应该是在重新回到系统之前，后面的所有定时器都不执行才对。但是实际测试并非如此，后面的定时器会延时...
android webview setTimeout不执行
bachelor49的专栏
10-29 4403
在Android开发中，难免需要载入H5页面处理一些扩展性需求，这个时候就需要使用webview了。 有时候js里面会用到 setTimeout 函数用来进行定时操作。 今天我就遇到使用了setTimeout，而没有任何反应的情况。 尝试各种方式而不得的情况下，我使用类似android代码里面呼叫js函数的方式，在js中进行修改： setTimeout(funA,3000)
浏览器页面进入后台后setTimeout不正确执行的解决方法
L435204的博客
04-19 2213
出于节能的考虑，一些浏览器（比如Chrome浏览器）会在页面进入后台等不活跃的状态时，延缓甚至暂停setTimeout等定时器的执行。在这个节能策略影响到前端页面的功能时，就需要想办法绕过此限制。本人翻阅了很多网络文章，发现使用web worker是一种比较合适的解决方案。经研究理解web worker的使用方法、结合前人经验、搭配自己的调试和优化，本人编写了一段仅实现上述功能，且简洁易于理解的代码。
【前端】关于setTimeout的那些事，setTimeout休眠延时。
驻咸阳湖特别形象大使
03-01 2217
问题： setTimeout在某一次写一个倒计时功能时，当浏览器缩小或者离开当前页面，倒计时会不准确，进入休眠模式，执行间隔比预期要慢。 为何不使用setInterval 先看下《JavaScript高级程序设计（第三版）》中对定时器解释 设定一个 150ms 后执行的定时器不代表到了 150ms 代码就立刻执行，它表示代码会在 150ms 后被加入到队列中。如果在这个时间点上，队列中没有其他东西，那么这段代码就会被执行。 也就是说定时器会在你任务队列中没用执行任务时才会将你的定时器添加到任务队列中。
Android安全开发之WebView中的大坑
zhangcanyan的博客
07-17 2万+
0X01 About WebView      在Android开发中，经常会使用WebView来实现WEB页面的展示，在Activiry中启动自己的浏览器，或者简单的展示一些在线内容等。WebView功能强大，应用广泛，但它是天使与恶魔的合体，一方面它增强了APP的上网体验，让APP功能更多样化，另一方面它也引入了很多的安全问题。在过去几年WebView中被披露的重大漏洞包括了任意代码执行
【每日学点HarmonyOS Next知识】页面传参、弹窗禁止点击空白关闭、双向绑定数据报错、销毁自定义组件、图片设置模糊
最新发布
轻口味的专栏
04-11 614
【每日学点HarmonyOS Next知识】页面传参、弹窗禁止点击空白关闭、双向绑定数据报错、销毁自定义组件、图片设置模糊
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值