一、错误类型任何一个框架，对于错误的处理都是一种必备的能力在Vue 中，则是定义了一套对应的错误处理规则给到使用者，且在源代码级别，对部分必要的过程做了一定的错误处理。主要的错误来源包括：后端接口错误代码中本身逻辑错误二、如何处理后端接口错误通过axios的interceptor实现网络请求的response先进行一层拦截apiClient.interceptors.response.u
转载
2024-10-18 12:26:36
66阅读
FrontJS 最早是用于蒲公英旗下项目管理平台 Tracup 中的一个性能工具，也就是我们一个月前发布的 frontend-tracker，发布后在一些社区内也有一些良好的反应。当我们尝试在蒲公英上使用这款工具的时候也出现了一些问题，比如，蒲公英每天能产生千万级别的访问信息，这使得原有的统计分析性能变得不是很理想，这对于一款统计分析为主的产品来说是致命的。我们及时调整了从于数据单元到分析单元的结
1.javascript中的七种错误类型SyntaxError（语法错误） ReferenceError（引用错误） RangeError（范围错误） TypeError（类型错误） URLError（URL错误） EvalError（eval错误） Error（基类型） 详情参考：跳转地址2.can’t not find ‘xxModule’ - 找不到某些依赖或者模块这种情况一般报错信息可以看
转载
2024-03-17 10:56:48
55阅读
在前端代码开发阶段，会有各种各样的bug，通常在上线之前我们会清理掉所有的bug，通过测试之后才上线，但是线上环境也不能保证不会出问题，有些问题可能出现了之后，用户也不会反馈，问题不容易复现，导致不好定位修复，如果有办法在发生异常的时候，自动监控，然后把异常通过接口上报到服务端，这样异常信息就能保留下来，就可以快速定位，修复问题 异常分类javascript代码异常（语法错误，执行报错，
转载
2024-07-24 05:50:57
53阅读
报错信息： [Vue warn]: Error compiling template：Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects ...
转载
2021-08-23 23:30:00
1047阅读
2评论
要比较两个函数哪个性能更好，一个直观且公平的方法就是计算两个函数分别执行完的时间。良好的性能更容易好的用户体验，而好的用户体验更能留住用户。研究表明，由于性能问题，在88％的在线消费者对用户体验不满意后，他们不太可能会二次使用。这也是为什么要提高性能的一个重要原因。特别是使用 JS 开发时，编写的每一行 JS 都可能会阻塞DOM，因为它是单线程语言。本次分享，我们主要介绍如何计算函数的性能。Per
转载
2024-06-13 21:59:46
62阅读
目录1. 简介2. 项目成员3. 整体架构3.1. 上报SDK3.2. 日志任务3.2.1. 日志任务数据处理流程3.2.2. 命令的语法及作用3.2.3. 执行周期3.3. 管理系统3.4. Web服务3.5. 公司基础设施内容1. 简介前端监控 是一套用于 监测 前端项目运行时情况，及时上报错、统计错误、性能和用户行为的系统。它能我们及时地发现线上客户端产品的错误、了解客户端产品的性能 等；目
转载
2024-06-09 00:53:10
79阅读
Web承载的业务越来越复杂，用户对于Web的体验要求也越来越高，Web性能的优劣对业务收益也有着非常直接的影响。 本文主要介绍阿里UC百亿级PV前端监控平台， 岳鹰全景监控平台 的实践历程 - 概述，阅读时长 10 分钟。为什么要打造前端监控系统？ 前端的开发环境比较复杂，页面在不同浏览器、微信等APP都可能展现不同，用户的网络网速、手机性能等，也会影响页面访问速度。在移动端可能更为明显，移动端用
转载
2024-05-17 13:29:55
143阅读
背景：市面上的监控系统有很多，大多收费，对于小型前端项目来说，必然是痛点。另一点主要原因是，功能虽然通用，却未必能够满足我们自己的需求, 所以我们自给自足也许是个不错的办法。 这是搭建前端监控系统的第二章，主要是介绍如何统计js报错，跟着我一步步做，你也能搭建出一个属于自己的前端监控系统。 目前已经在运行的线上Demo ： 前端监控系统 
背景 在开发Vue项目时，使用浏览器调试可以比较清晰的看到报的什么错、在哪报错，或者使用console.log()打印出报错信息，以便快速定位到报错源头并解决，但是如果项目上线了又怎么查看呢。对于上线项目来说，一般都是会有代码混淆以及禁用console.log()，这个时候再使用浏览器调试就有点不太方便了。另一种场景，如果要做一个前端报错监控平台，那这些报错信息又应该如何收集呢。本文就重点介绍四种
转载
2024-05-05 17:39:34
975阅读
文章目录前端错误监控的简单设计与实现前端埋点错误类型异常上报的数据格式异常上报防抖处理缓存异常上报数据来限制上报频率异常上报可定制化配置前端异常监控代码后端限流异步发送邮件发送邮件阻塞问题总结参考 前端错误监控的简单设计与实现在之前的博文中讲了在前端React的错误监控系统要如何设计《React 错误处理和日志记录的思考与设计》这篇博文主要讲一下根据如下的业务场景并结合《React 错误处理和日
转载
2024-05-22 13:02:16
64阅读
一、事件相关内容1、事件处理 1、使用v-on:xxx或@xxx绑定事件，其中xxx是事件名。 2、事件的回调需要配置在methods对象中，最终会在vm上。 3、methods中配置的函数，不要用箭头函数！否则this就不是vm了。 4、methods中配置的函数，都是被Vue所管理的函数，this的指向是vm 或 组件实例对象。 5、@click="demo" 和 @click="demo($
目录1 浏览器Performance指标说明1.1 浏览器打开网页的各个阶段1.2 Navigation Timing API1.3 Navigation Timing API兼容性1.4 网页性能数据计算方法1.4.1 页面加载完成的时间1.4.2 DOM 树结构解析时间1.4.3 重定向的时间1.4.4 DNS 查询时间1.4.5 读取页面第一个字节的时间（白屏时间）1.4.6 内容加载完成
转载
2024-08-03 09:13:11
98阅读
vnStat 简介vnStat 是一款轻量级的网络流量监控工具，目前各大 Linux/BSD 系统都已内置支持。vnStat 本身只支持命令行的交互方式，而 Web 前端则由第三方工具支持。这里汇总并对比下 vnStat 的几种 Web 前端并为大家推荐最佳的一款。vnStat Web 前端对比vnStat 首页推荐的四个前端有：vnStat SVG frontend: 基于
1.模板语法 1.1.文本插值，数据绑定。{{}}，如：<p>{{ message }}</p>1.2.输出HTML代码。v-html，如：<div v-html="message"></div> v-bind，如：<div id="app">
<pre><a v-bind:href="url">
转载
2024-04-22 10:29:57
29阅读
Vue的5种处理Vue异常的方法相信大家对Vue的不陌生。在使用Vue的时候也会遇到报错，也会使用浏览器的F12 来查看报错信息。但是你知道Vue是如何进行异常抛出的吗？vue 是如何处理异常的呢？接下来和大家介绍介绍，Vue是如何处理者几种常见的报错的。先很大家说说常见的报错，再和大家介绍如何处理Vue 中异常处理包含以下几个方面的技巧：errorHandlerwarnHandlerrender
前言在做完一个项目后，之后的维护尤为重要。这时，如果项目配置了错误日志记录，这样能大大减少维护难度。虽然不一定能捕获到全部的错误，但是一般的错误还是可以监测到的。这样就不用测试人员去一遍一遍复现bug了。一、准备工作（1）规定错误码像是请求码（404、500）一样，我觉得错误都应该规定好对应的错误码。个人喜好。// 错误代码
const errCode = new Map([
// 本地系统错
基于webpack的配置调试使用Vue-cli命令行工具初始化基于wabpack模板的项目的命令语法：npm install -g @vue/cli # 全局安装vue-cli,版本vue3.x
vue init webpack [my-project] [app-name] # 使用vue-cli初始化一个完整的webpack项目。
cd my-project
转载
2024-05-16 20:32:16
120阅读
监视属性-watch方法说明1.通过通过vm 对象的$watch()或watch 配置来监视指定的属性2.当属性变化时, 回调函数自动调用, 在函数内部进行计算监视属性watch：1.当被监视的属性变化时, 回调函数自动调用, 进行相关操作 2.监视的属性必须存在，才能进行监视！！ 3.监视的两种写法： (1).new Vue时传入watch配置<!DOCTYPE html>
<
转载
2024-03-26 14:03:59
68阅读
1 前言现有的大部分监控方案都是针对服务端的，而针对前端的监控很少，诸如线上页面的白屏时间是多少、静态资源的加载情况如何、接口请求耗时好久、什么时候挂掉了、为什么挂掉，这些都不清楚。同时，在产品推广过程中，经常需要统计页面的使用情况及用户行为，从而可以从运营和产品的角度去了解用户群体，进而迭代升级产品，使其更加贴近用户，为业务的扩展提供更多可能性。因而，我们需要一个前端的页面监控系
