首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

html5离线缓存manifest详解

随着Web App的发展,越来越多的移动端App使用HTML5的方式来开发,除了一些HybridApp以外,其他一部分Web App还是通过浏览器来访问的,通过浏览器访问就需要联网发送请求,这样就使得用户在离线的状态下无法使用...Manifest的优点离线浏览 – 用户可在应用离线使用它们提升速度 – 已缓存资源加载得更快减少服务器负载 – 浏览器将只从服务器下载更新过或更改过的资源。...:CACHE:表示需要离线存储的资源列表,由于包含manifest文件的页面将被自动离线存储,所以不需要把页面自身也列出来。...在更新了资源之后,新的资源需要到下次再打开app才会生效,如果需要资源马上就能生效,那么可以使用window.applicationCache.swapCache()方法来使之生效,出现这种现象的原因是浏览器会先使用离线资源加载页面...,然后再去检查manifest是否有更新,所以需要到下次打开页面才能生效。

1.8K30

【开发指南】(四)Ionic3快速上手并了解这些

开发环境配置 开发ionic项目,我们经常需要使用ionic-cli,其内置了很多命令,基本每个命令都带可选的参数,如参数--help,要想知道某个命令的详情,在敲入命令后面加上--help即可,如敲入以下命令...出现下面内容,说明项目创建成功。 ?...成功提示 其中,我们可以cd myDemo进入到项目,然后根据上图,敲入命令在浏览器预览: ionic serve 也可以两步并作一步执行: cd myDemo && ionic serve 命令执行完...我们打开该文件,里面是基本的配置,如$colors,可以随意增删改,使用某种颜色,元素标签添加color=“danger”即可使用这里定义的颜色。...一般一个页面三个部分css、ts、html,如果每个手动创建或者复制,效率不高且容易出错,用此指令,只需下面一句即可同时创建这三个文件: ionic g page testPage 7、了解Cordova

3.2K20
您找到你想要的搜索结果了吗?
是的
没有找到

【开发指南】(三)认识ionic3

js实现,然后通过js桥接,使用原生界面渲染,也就是说,它比第一代增强了页面显示的功能,等到第三代了,通过编译把js桥接部分也省掉,直接生成原生可执行的代码,把性能又提高了一个档次。...Hybird应用Cordova技术,它只提供了使用JavaScript调用Native功能,在开发的时候还需要开发人员自己去实现诸如样式美化、页面切换、数据展示、弹出框、Modal窗体、日期选择器等功能或组件...其实ionic3基本向下兼容ionic2,除去性能等问题,两个版本变更编码直观感受深点的,就是懒加载和路由的调整(新版懒加载变得更加简单,利于web版开发和加快页面首屏加载),另外还有内置指令的更灵活化...并且可以更轻松的在项目中设置延迟加载,设置延迟加载页面的优先级,并为每个页面自定义配置。...懒加载 Ionic3.0版本开始,支持了延迟加载,我们可以将某些模块设置为延时加载,只有用户打开相关的页面的时候,这个模块所在的js才会被下载,这样能减少用户初次下载的文件的大小。

2.7K40

Js处理滚动条和日期

滚动条不是html页面的元素,它是浏览器的元素。想获取浏览器的元素,就不能走常规套路啦,要通过javascript来执行。 不是所有的元素都一定要拖动到可见区域才能操作的。...例如百度搜索中,最后选择这个页面跳转: ? 例如底部的页面跳转:有的系统,虽然进来是这个地方,想操作页面底部的元素,可以操作,也不需要拖动滚动条,它会自动将它拖动到可见区域,然后去操作它。...7)方法.scrolllntoView()和方法.scrolllntoView(false)的区别: 用电脑打开一个页面,在整个浏览器的网页内容可视区当中,有宽和高。 ? 这个是浏览器可视区的高度。...例如元素在页面正中间,想将它滚动到可见区域,必须有向上和向下这2种做法。 如果你希望他向上。 一种,.scrolllntoView()默认跟页面顶部对齐: ?...如果日期输入框,本身就可以直接输入的,send_keys就可以了,不需要去日期框里面去选。 2)手工测试的时候是要去日期框里面去选的,自动化为什么不需要去选,不怕出问题嘛?

10.8K10

自己动手打造前端性能监控系统

在公司层面,页面性能会影响公司收益,如用户打开页面等待的太久,用户可能会直接关掉页面,或者下次不再打开了,特别是在移动端用户页面响应延迟容忍度很低。...用户最大感受就是,页面为什么打开要等那么久,为什么图片加载那么慢,页面加载半天也不能点击。这些用户的感受对于程序员来说就是重要的页面性能指标。...此接口大部分浏览器都已经支持,除了pc端ie9以下的浏览器。 白屏时间 用户看到页面展示出现一个元素的时间。...入库,入库服务器定时从上报机器上拉取日志,进行数据入库。 数据的入库 数据的处理是该系统一大难题,全平台每天的pv上亿。为了避免数据过于庞大,我们将收集的数据按日期建立新表。...阈值告警 在某个数据接口返回太慢而导致页面打开速度变慢,这个时候我们需要一个预警,来通知开发人员,在处理数据入库某个节点5分钟平均用时超过预设阈值,或者默认阈值10秒,系统会将这个信息以某种方式来告诉开发人员

3.6K101

新梦想干货——软件测试中的43个功能测试点(下)

如果系统安全性设计的不好,直接输入各功能页面的URL地址,很有可能会正常打开页面。...同样,提供注销功能的系统,此用户注册,是否作为一个新的用户,而且还要检查该用户的有效日期,过了有效日期用户是不能登录系统的,容易出现错误的情况是,可能有用户管理权限的非超级管理员,能够够修改超级管理员的权限...29.系统数据检查 这是功能测试最重要的,如果系统数据计算不正确,那么功能测试是肯定通不过的,数据检查根据不同的系统,方法不同于业务管理平台,数据随业务过程、状态的变化保持正确,不能因为某个过程出现垃圾数据...39.测试数据检查 事实告诉我们,软件测试数据比代码更有可能是错的,因此,测试结果显示有错误发生,怀疑代码错误前要先对测试数据检查一遍。...42.Ajax技术的应用 Ajax采用异步调用的机制实现页面部分刷新功能,异步调用存在异常中断的可能,尝试各种方法异常中断异步的数据调用,查看是否出现问题。

1.3K40

excel常用操作大全

3.在EXCEL中输入“1-1”和“1-2”等格式后,将成为日期格式,如1月1日和1月2日。我该怎么办? 这是由EXCEL自动识别日期格式造成的。...在EXCEL菜单中,单击文件-页面设置-工作表-打印标题;您可以通过按下折叠对话框的按钮并用鼠标划定范围,将标题设置在顶端或左端。这样,Excel会自动将您指定的部分添加为每页的页眉。...22.如果您的工作表中有某个序列项目,并且您希望将其定义为自动填充序列以供以后使用,您是否需要根据上面介绍的自定义序列方法重新输入这些序列项目? 没必要。...打开工作簿,在“文件”菜单中选择“另存为”,选择“工具”-“常规选项”,根据用户需要分别输入“打开权限密码”或“修改权限密码”,按“确定”退出。...当我们在工作表中输入数据,我们有时会在向下滚动记住每个列标题的相对位置,尤其是标题行消失时。此时,您可以将窗口分成几个部分,然后将标题部分保留在屏幕上,只滚动数据部分

19.1K10

面试必会之事务如何保证原子性-undo日志

对于只读事务来说,只有在它对一次对用户创建的临时表执行增删改操作,才会分配个事务id,否则不会分配。 对于读写事务来说,只有在它第一次对某个表执行增删改操作,才会分配事务id,否则不会。...trx_id隐藏列 trx_id就是事务id,之前我们在聊InnoDB行格式的时候重点说过,聚簇索引的记录除了保存完整的用户数据以外,还会自动添加名为trx_id、roll_pointer的隐藏列,如果没有定义主键还会自动添加个...根据段与undo日志的页号以及offset(undo日志在页面中的偏移量)来定位到具体的日志。...否则,会先将记录从正常的链表中直接移除到垃圾链表中,当事务提交真正删除,然后在创建新纪录,如果根据页面剩余大小判断是否需要页分裂。...具体的操作是在128个回段中找到活跃的undo页面链表,在在undo页面链表中找到对应的事务相关信息,将操作全部回掉,保证事物的原子性。

67531

目前比较火的前端框架及UI组件

那些后端程序员们根本不操心具体数据是如何从一个页面传递到另一个页面的,他们也不用管用户数据更新是通过Ajax异步获取的还是通过刷新页面。   3....大量Ajax请求的应用 例如个性化应用,每个用户看到的页面都不一样,缓存失效,需要在页面加载的时候发起Ajax请求,NodeJS能响应大量的并发请求。  ...它鼓励在使用脚本以module ID替代URL地址。 RequireJS以一个相对于baseUrl的地址来加载所有的代码。...10.Ionic 地址:点击打开链接 描述:Ionic既是一个CSS框架也是一个Javascript UI库。...Ionic遵循视图控制模式,通俗的理解和 Cocoa 触摸框架相似。在视图控制模式中,我们将界面的不同部分分为子视图或包含其他视图的子视图控制器。然后视图控制器“驱动”内部视图来提供交互和UI功能。

4.9K40

mysql事务-redoundo log

但是会面临一些问题: 刷新一个完整的数据页太浪费了:有时候我们仅仅修改了某个页面中的一个字节,但是我们知道在InnoDB中是以页为单位来进行磁盘IO的,也就是说我们在该事务提交不得不将一个完整的页面从内存中刷新到磁盘...要满足事务的回对一条记录做改动(这里的改动可以指INSERT、DELETE、UPDATE),都需要把回所需的东西都给记下来。...事务id 开启事务的时候,innodb 会为当前事务分配一个唯一的事务id, 本质上就是一个数字,它的分配策略和行记录的隐藏列row_id(当用户没有为表创建主键和UNIQUE键InnoDB自动创建的列...,而且还会自动添加名为trx_id、roll_pointer(roll_pointer指向的是 记录所对应的 undo log)的隐藏列,如果用户没有在表中定义主键以及UNIQUE键,还会自动添加一个名为...将被删除记录从正常链表移动到垃圾链表中(备注: 一个页被回收足够多的垃圾链表, 默认 50% 阈值会发生页合并) update undo log Redo, Undo 在整个执行过程中的流程

62210

移动端H5坑位指南

页面包含多个滚动区域完一个区域后若还存在滚动动量则会将这些剩余动量传播到下一个滚动区域,造成该区域也滚动起来。这种行为称为滚动传播。 若不想产生这种奇怪行为可直接禁止。...弹窗打开后内部内容无法滚动 弹窗关闭后页面滚动位置丢失 Webview能上下滑动露出底色 打开弹窗给声明position:fixed;left:0;width:100%并动态声明top。...const date = "2019-03-31 21:30:00"; new Date(date.replace(/\-/g, "-")); 复制代码 修复高度坍塌 页面同时出现以下三个条件,键盘占位会把页面高度压缩一部分...自动播放媒体 常见媒体元素包括音频和视频,为了让用户得到更好的媒体播放体验与不盲目浪费用户流量,大部分移动端浏览器都明确规定不能自动播放媒体或默认屏蔽autoplay。...,未得到用户响应会被Safari自动拦截,因此需监听用户首次触摸操作并触发媒体自动播放,而该监听仅此一次。

3.4K10

使用Ionic2开发Todo应用0 开始之前1 创建新的Ionic 2工程2. 设置主页(Home page)3 持久化数据保存4 总结

运行以下命令创建新项目 ionic start ionic-todo blank --v2 一旦代码生成,在文本编辑器打开项目。...Todos 列表页面 在运行** ionic serve ** ,因为既然我们导入了NavController服务,我们就可以在这个组件push或pop视图,如下所示: this.navCtrl.push...这将允许我们建立一个侦听器,回到主页(就是那个启动这个页面的另外一个页面)获取数据。通过这种方式,我们可以从一个页面传递数据到另一个页面(然而,记住,模态不需要在页面之间传递数据)。...我们现在导入import我们新增的AddItemPage组件到HomePage,当用户点击新增我们就创建出该视图。...2.7 查看项目 现在,我们想要一个功能,就是用户点击todo列表里面的某一项,然后可以看到该项的细节信息(例如:这里只有描述可以看了,实际可以根据需要扩展,呵呵)。

6.1K50

构建具有用户身份认证的 Ionic 应用

运行以下命令来打开你的 Ionic 应用。 cd ionic-auth ionic serve 这个命令默认打开浏览器的 http://localhost:8100。...为了查看应用程序在不同设备上的效果,你可以运行 ionic serve --lab。--lab 标识会在浏览器中打开一个页面让你查看在不同设备中的效果。 ?...LoginPage 在加载时会自动聚焦到 email 输入框。为了自动激活键盘,你需要告诉 Cordova 没有用户交互的情况下显示键盘是可以的。...出现提示输入 "y",按回车。 TIP: 我发现在模拟器中运行应用程序时的最大问题是键盘很难弹出。...想要了解如何使用 service workers 并把 app 转换成 PWA ,可以阅读 如何使用 Ionic 和 Spring Boot 开发移动应用 的 PWAs 部分

23.8K00

JavaScript学习参考结构

toLocaleDateString() 根据本地时间格式,把 Date 对象的日期部分转换为字符串。 UTC() 根据世界返回 1970 年 1 月 1 日 到指定日期的毫秒数。...screenY 返回某个事件被触发,鼠标指针的垂直坐标。 shiftKey 返回当事件被触发,"SHIFT" 键是否被按下。...moveTo() 把窗口的左上角移动到一个指定的坐标。 open() 打开一个新的浏览器窗口或查找一个已命名的窗口。 print() 打印当前窗口的内容。...如果用户点击取消,那么返回值为 false。 语法:confirm("文本") 提示框 提示框经常用于提示用户在进入页面前输入某个值。...提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。 如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。

2K20

Ionic3 导航分析

之前接触的路由,基本上都是根据不同的url加载不同的内容,比如最基本的,根据url的不同加载不同的html文件;或者像React中根据不同的url加载不同的组件,这种导航方式很直接,也非常方便理解。...image.png uiRouter 路由是前端构建单页面应用(SPA)必不可少的一部分,AngularJS1.x中有两种路由实现,一个是内置的ngRouter,还有一个是基于 ngRoute...而对于界面的跳转,Ionic提供了一套自己的API,最常用的就是NavController,这个类中几乎包含了与导航有关的所有方法,通过这个接口可以满足绝大部分需求。...其中登录界面作为一个独立的 界面,tab界面中的某个tab上有退出当前用户功能,退出之后重新跳回到登录界面,很常见的一个流程。 登录界面 ?...this.nativeService.isLogin(false) 是我自己实现的一个函数,用于判断用户是否登录。 // 加载tabs页面之前先判断是否登录(就是进入系统展示登录界面) if (!

2K10

构建具有用户身份认证的 Ionic 应用

运行以下命令来打开你的 Ionic 应用。 cd ionic-auth ionic serve 这个命令默认打开浏览器的 http://localhost:8100。...为了查看应用程序在不同设备上的效果,你可以运行 ionic serve --lab。--lab 标识会在浏览器中打开一个页面让你查看在不同设备中的效果。 ?...LoginPage 在加载时会自动聚焦到 email 输入框。为了自动激活键盘,你需要告诉 Cordova 没有用户交互的情况下显示键盘是可以的。...出现提示输入 "y",按回车。 TIP: 我发现在模拟器中运行应用程序时的最大问题是键盘很难弹出。...想要了解如何使用 service workers 并把 app 转换成 PWA ,可以阅读 如何使用 Ionic 和 Spring Boot 开发移动应用 的 PWAs 部分

23.2K50

中高级前端必须注意的40条移动端H5坑位指南 | 网易三年实践

页面包含多个滚动区域完一个区域后若还存在滚动动量则会将这些剩余动量传播到下一个滚动区域,造成该区域也滚动起来。这种行为称为「滚动传播」。 若不想产生这种奇怪行为可直接禁止。...弹窗打开后内部内容无法滚动 弹窗关闭后页面滚动位置丢失 Webview能上下滑动露出底色 打开弹窗给声明position:fixed;left:0;width:100%并动态声明top。...const date = "2019-03-31 21:30:00"; new Date(date.replace(/\-/g, "/")); 修复高度坍塌 页面同时出现以下三个条件,键盘占位会把页面高度压缩一部分...自动播放媒体 常见媒体元素包括音频和视频,为了让用户得到更好的媒体播放体验与不盲目浪费用户流量,大部分移动端浏览器都明确规定不能自动播放媒体或默认屏蔽autoplay。...,未得到用户响应会被Safari自动拦截,因此需监听用户首次触摸操作并触发媒体自动播放,而该监听仅此一次。

4.2K21

最新iOS设计规范五|3大界面要素:控件(Controls)

用户可以点击页面控件的前端或后端来访问下一页或上一页,但是他们不能点击特定的点来转到特定的页面。导航通常是按顺序进行的,通常是将页面动到一侧。 ? 不要在层级不同的页面之间使用页面控件。...人们点击按钮日期选择器将扩展为模式视图,从而提供对熟悉的日历样式编辑器和时间选择器的访问。在模式视图中,人们可以对日期和时间进行多次编辑,然后在视图外部轻按以确认他们的选择。...进度条非常适合显示任务的状态,尤其是它帮助传达任务需要完成多长时间。 在导航栏和工具栏中隐藏轨道的未填充部分。默认情况下,进度条的轨道包含已填充和未填充的部分。...根据设计风格,自定义开关在其关闭和打开的背景颜色,可以使开关在APP中的体验更好。 仅在列表中使用开关。开关用在列表中,例如可以打开和关闭的设置列表。...键盘 根据实际情况,显示适当的键盘类型。iOS提供了几种不同的键盘类型,每种键盘都用于方便不同文本类型的输入。当用户在输入文本根据输入的文本类型显示相应的键盘类型,可以简化数据输入。

8.5K30

实战使用Axure设计App,使用WebStorm开发(6) – 迈向后端

开发(5) – 实现页面功能 实战使用Axure设计App,使用WebStorm开发(6) – 迈向后端 接上一篇系列文章,在本文中,将连接后端服务,实现用户登录功能,并去掉前端的MockDB,使用服务器端的数据...App服务端 咱们选择了Express作为App的服务端技术,Express需要先安装NodeJS,在之前的Ionic安装部分,已经安装好了NodeJS。...在实际的项目中,这个地方是后端的业务逻辑,根据请求中的用户名和密码去检查用户信息,这里是模拟后端服务,所以直接返回了登陆成功。...前端重构 services.js 需要大的改动,需要删除MockDB, 使用 $http 从后端取得数据,在CommonService中有一个buildUrl方法,只要填写相对Url就可以了,Server...安装好以后,在浏览器上会出现图标,打开此功能。 ? 这样数据就可以请求到后端了。

2.5K80
领券