首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

前端监控】页面错误监控

上报页面错误数据! 言简意赅!不废话!...本文分为4个部分 1、页面错误分类 2、错误监听具体处理 页面错误分类 页面错误这种数据上报的重要性,想必不用我多说了吧 页面通常就分为3种错误 1、js 报错 2、资源加载错误 3、请求报错 其中js...不属于 promise 错误 所以它会被前面的 window.onerror 捕获到,而不会触发 unhandledrejection 事件 资源报错 监控资源报错我们在另一篇内容有总结,具体可以看 【前端监控...所以我们这里只监听资源错误就好了 window.document.addEventListener('error',handler, true) 请求报错 请求报错的内容,也已经写过,具体可以参考 【前端监控...最后可以看下我们对于线上页面监控的一个异常数据对比图,大概长这样(数据是假的) 可以很清楚看到线上页面的稳定性,一个字,稳 最后 鉴于本人能力有限,难免会有疏漏错误的地方,请大家多多包涵, 如果有任何描述不当的地方

1.9K10

前端的单页面模式和多页面模式

一、前言   前端部分的搭建,需要考虑使用哪种模式进行页面之间的跳转交互,   而项目内的页面交互,不可避免的需要相互之间的数据共享。   ...这就引出了本篇博客的目的,一起来谈谈:项目前端部分的构建方式以及数据共享方式。...二、正文   (一)、搭建前端部分所需要注意的问题   1)方便性      结合开发的时间需求和方便性选择适合的前端模式;   2)性能      在项目的体量比较大,或者某个页面需要加载较多文件时...(二)、前端搭建的模式选择(多页面模式和单页面模式) 图片来源:https://blog.csdn.net/u013291076/article/details/53667382 1)多页面模式(MPA...,是一件很可怕而又不稳定的无奈选择 三、结语 前端的明天在框架,得学vue了

1.4K30

前端页面热更新实现方案

前端页面热更新 了解过前端性能优化的同学应该清楚,给页面加载提速的终极方案就是CDN,这是BS架构本身的特点决定的,无论什么前端提速手段,最终都会回到客户端文件的传输上来;与之相对的CS架构则不存在加载压力...这就是本文要探讨的一种方案:前端热更新。...”这个破坏连贯性的动作隐藏于无形;前端页面的加载则相当于每次都是“全量更新”,如果能让前端页面也能用上“本地模板”,那将极大缩短前端加载时间,而且以此为前提,我们也可以实现一个前端的模板热更新机制,做到不影响页面更新的实时性...最终可以做到热更新页面无论改版还是做活动,只需要前端发版就可以,完全不需要APP端参与。 场景二:追求加载速度的web页面。...activeVersion": { "id": "18", "url": "", "cycle": "2018,02,01-2018,02,10", "template": "" } } 模板文件 前端页面由三种语言构成

2.2K50

前端技术提高页面加载速度

XHTML 可能使您的页面更加符合标准,但是它大量使用标记(强制性的 和 标记),这意味着浏览器要下载更多代码。所以,事情都有两面性,尝试在您的网页中使用较少的 XHTML 代码,以减小页面大小。...如果您真正需要在网页上放置许多内容,考虑将网页分为 2 个、3 个或更多的独立页面。...十三、尽可能延迟脚本加载 一种提升页面下载速度的潜在方式是将脚本放在页面的底部,使页面加载更迅速。...如果将 JavaScript 代码放在页面底部,(在大多数情况下)它将在最后下载,这时所有其他组件都已下载完。...Gears 允许用户离线访问 Web 应用程序,但是也允许将页面元素持久化到用户的计算机上。

3.5K20

前端页面显示Markdown文档

二、帮助页面开发搞测试平台嘛,肯定是需要开发一个帮助页面,总不能每次同事一有问题就都来找我问怎么解决吧。...三、痛点帮助页面,隔三岔五会有新增功能或者原有功能调整啥的,肯定是需要时常编辑和调整的,如果修改一次帮助文档,就改一次前端页面代码,那肯定是不太方便的。...四、解决思路markdwon,各位都不陌生,页面简洁,维护简单,大家用了都说好。那么我们是不是可以直接用markdown文档来维护一份帮助文档,然后直接在前端显示呢?...src="/static/js/jquery-3.7.1.slim.min.js">2、前端页面新增...getHelpDoc()4、后端维护一份markdown文档六、遇到的问题1、 图片显示大小在markdown文档中,我们也markdown语法插入图片时,在本地显示图片大小是正常的,而在前端页面经过

37810

前端工程化-自动生成页面

前言 我们的项目是基于vue-cli搭建的,每次需要新加一个页面需要操作以下步骤: 在views文件夹下面新建一个文件夹,用来存放新页面的.vue文件。...按照上述操作以后,才可以正常访问新添加的页面,之后才开始对新页面进行正常开发。...但是这样的机械化步骤我们完全可以用代码帮我们执行,更进一步,对于一些简单的页面,我们甚至可以一键生成页面,包括从后端请求数据等操作。...自动生成页面 我们可以按照模板的方式生成想要的页面,我这里说两种页面, 一种是什么都没有的空白页,生成空白页就相当于是初始化一个新页面然后接着开发。...另一种是生成一些比较固定布局的简单页面,比如我们的业务中经常会有需求是写一个页面,就一个表格展示一下后端返回的数据,顶多就是再加个删除,添加和编辑。像这种简单的页面,完全可以使用代码自动生成。

81220

前端-如何精确统计页面停留时长

对于常规页面的 首次加载、页面关闭、刷新 等操作都可以通过 window.onload 和 window.onbeforeunload 事件来监听页面进入和离开,浏览器前进后退可以通过 pageshow...注意是有可能切换,因为URL发生变化不代表页面一定切换,具体的路由配置是由业务决定的(既URL和页面的匹配规则)。...2.3.1 页面离开时上报 对于页面刷新或者关闭窗口触发的操作可能会造成数据丢失 2.3.2 下次打开页面时上报 会丢失历史访问记录中的最后一个页面数据 目前采用的方案2,对于单页内部跳转是即时上报,对于单页...Page 页面的抽象类,用来实例化一个页面,封装了 enter exit active inactive 等操作,内部通过 state 属性来维护当前页面状态。 ? 3.2 事件派发关系图 ?...5.思考 对于页面停留时长的定义可能在不同场景会有差异,比如内部业务系统或者OA系统,产品可能更关心用户在页面的活跃时长;而对于资讯类型的产品,页面可见时长会更有价值。

9.2K20

前端页面停留时长」统计上报方案

---- 背景 为了解用户在我们H5页面的行为习惯,我们需要统计和上报用户在H5具体某个页面的停留时长。 当我们的H5页面是一个vue单页面应用,我们需要具体统计到每个路由的停留时长。...方案设计 问题一:停留时长的统计 通过调研,单页面应用统计页面时长,有以下这几种方案: (1)页面在打开状态下,每隔一段时间给服务端发一个请求,由服务端计算页面时长; (2)在页面打开和关闭的时候,分别给服务端上报一个请求...,由服务端计算页面时长; (3)前端监听页面的打开和关闭,计算出页面停留时长,直接上报服务端。...浏览器兼容情况,这里需要试验的浏览器太多,我们直接找到网上的一个结论: IE浏览器 页面跳转、刷新页面能执行,但关闭浏览器不能执行; firefox 页面跳转能执行,但刷新页面、关闭浏览器不能执行; Safari...刷新页面页面跳转,关闭浏览器都会执行; Opera、Chrome任何情况都不执行。

1.8K20
领券