微信小程序是支持 typescript 的，官网提供了类型库，可以通过开发者工具直接创建 ts 项目。百度小程序目前是不支持的，效率就要低很多。
微信小程序的数据绑定之前一直是单向的，这个很多时候不太方便，要多写很多代码，好在从 2.9.3 开始可以双向绑定了，效率上也提升了不少。百度小程序目前还不支持，其它的平台了解的不多。
由于小程序都不支持 dom *** 作，而是内部提供了一套类 dom 的查询api，所以有一定的学习成本，也不能轻易的将 html5 程序转换到小程序。同时，各种涉及 dom *** 作的 js 库也无法使用，canvas 库也不行，仅有少数的库专门做了小程序版本，如 echarts。从这一点来看，效率的影响还是很大的，毕竟项目开发是需要借助于很多开源库的，改造成支持小程序的版本是很耗费时间和精力的。
总体上来说，微信小程序的开发效率还行，但是很多现有的 js 库不能利用，开发效率肯定比不上使用 vue 全家桶开发 web 应用。
硬件调用和系统原生特性
这个确实是小程序的优势，微信的小程序有丰富的设备接口，可以调用蓝牙、nfc和感应器等，浏览器中仅个别浏览器可以调用蓝牙。如果有硬件调用方便的需求，就只能放弃纯 html5 了。
统计分析
微信小程序有个数据助手，其它平台的基本上都有，在数据助手中可以查看使用情况，对用户和页面的信息进行统计。
对于 web 站点，要做这么一套东西，还是有不少的工作量的，数据库的成本也要增加，可以借助于第三方平台，像百度统计之类的。如果是前后端分离，前端 spa 模式纯静态，可以将前端程序放在 cdn 中，cdn 服务一般都会提供统计信息，但是会弱一些。
小程序的云开发功能
微信小程序提供了云开发功能，可以在小程序中使用文件存储、数据库和云函数，现在还提供了云托管和静态网站，百度小程序也有提供支持。相当于后端开发需要用到的技术都给你集成好了，并且还有免费额度，大大降低了成本，你甚至可以零硬件成本起步，非常适合小项目。
性能
小程序性能会更好吗？这个可不一定，就我的经验来看，微信小程序流畅度还可以，没有详细测试过，但是百度小程序就比较的拉跨了，明显的卡，页面上的图片资源加载很慢。我之前使用百度官方的工具移植微信小程序到百度，结果百度app中小程序的运行效果非常差，卡顿明显。
但是小程序确实比普通的 web 应用更快，这主要是因为运行小程序的 app 中自带了运行环境，集成了框架和一些 ui 库，这样小程序本身就可以很小。因此，加载小程序的速度是可以比网页快很多的。但是，web 有 pwa 技术啊，并且主流浏览器都支持了。win10 自带浏览器 edge 支持将支持 pwa 的站点添加到桌面，直接独立窗口启动，ios 和安卓也都是支持的，可以让支持 pwa 的站点像原生应用一样直接从桌面启动，脱机运行，不需要先启动微信这样的小程序容器程序。
不仅如此，微软官方还支持将 pwa 直接发布到应用商店：将渐进式 Web 应用发布到Microsoft Store 。
相比 html5 ，小程序是没有性能优势的，html5 如果想进一步提升性能，还可以使用 WebAssembly 技术。
总结
小程序最大的价值应该就是其平台本身的生态了，微信小程序就提供了很多便利：
便捷接入微信登录和微信支付，与视频号，消息等对接
提供文本和图片内容安全检查功能，这些功能要自己做成本非常高
提供ai功能，提供视觉算法，支持人脸识别
有丰富的设备接口，支持对蓝牙、nfc和各种感应器等进行控制
自带统计分析功能
提供云开发服务，前期甚至可以零硬件成本，个人觉得云开发不适合大型项目
内置广告组件，提供了流量变现功能
虽然小程序提供了很多便利，但是个人觉得还是要慎重选择，小程序是需要与平台绑定的，各个平台推出自己的小程序就是要将软件商拉到自己的生态中去。如果你需要小程序给你提供的这些便利，团队没有预算开发各个平台的不同版本 app，那还是可以考虑的，使用小程序能降低不少成本，甚至还可以省去域名费用。
如果你喜欢自由，不愿受制于平台，还是 html5 吧。真有接入微信的需求，还可以考虑在 html5 的基础上使用 wx-sdk 接入公共号网页开发，可以做一个兼容层，在非微信内置浏览器内使用或微信调用失败的情况下回退到纯 html5。
个人认为，还是 html5 优先，html5 满足不了需求再考虑小程序和 app，毕竟 html5 是国际标准，几乎被所有 *** 作系统原生支持，真正的跨平台一码多端，这才是未来。
一、命令式埋点命令式埋点，顾名思义，开发者需要手动在需要埋点的节点处进行埋点。如点击按钮或链接后的回调函数、页面ready时进行请求的发送。
// 页面加载时发送埋点请求
$(document).ready(function(){
// ... 这里存在一些业务逻辑
sendRequest(params)
})
// 按钮点击时发送埋点请求
$('button').click(function(){
// ... 这里存在一些业务逻辑
sendRequest(params)
})
可以很容易发现，这样的做法很有可能会将埋点代码侵入业务代码，这使整体业务代码变得繁琐，容易出错，且后续代码会愈加膨胀，难以维护。所以，我们需要让埋点的代码与具体的业务逻辑解耦，即 声明式埋点 ，从而提高埋点的效率和代码的可维护性。
二、声明式埋点
点击埋点：自定义指令实现统计用户在应用内的每一次点击事件，如新闻的浏览次数、文件下载的次数、推荐商品的命中次数等。
在项目入口文件 main.js 中配置我们的自定义指令
Vue.directive('log', {
bind(el, binding) {
el.addEventListener('click', () =>{
Axios.post //发送请求
}, false)
}
})
组件中配置使用v-log指令，加上详情参数就可以完成用户轨迹记录。
// caption表示埋点的模块；paras表示用户的行为
<button v-log="{caption:'登录页', paras: '用户点击验证码发送'}">发送验证码</button>
页面埋点：统计用户进入或离开页面的各种维度信息，如页面浏览次数（PV）、浏览页面人数（UV）、页面停留时间、浏览器信息等。
使用 vue-router 的 beforeEach 或者 afterEach 钩子上报数据，具体使用哪个最好是根据业务逻辑来选择。
/**页面埋点方案*/
let startTime = Date.now()
let currentTime
router.beforeEach((to, from, next) =>{
if (to) {
// 第一步：页面跳转后记录一下当前的时间 currentTime
currentTime = Date.now()
// 第二步：计算 currentTime - startTime 的 差值
const user = JSON.parse(localStorage.getItem("sysUser"))
const log = {
当前用户: user.userId,
当前页路由: from.name,
当前页菜单名: from.name,
目标页: to.name,
开始时间: startTime,
结束时间: currentTime,
// "停留时间(ms)": currentTime - startTime,
"停留时间(s)": parseInt((currentTime - startTime) / 1000),
}
console.table(log, "log")
// 第三步：每次都要初始化一下 startTime
startTime = Date.now()
}
next()
})
文章知识点与官方知识档案匹配
Vue入门技能树首页概览
24151 人正在系统学习中
关注展开
打开CSDN APP，看更多技术内容
捕获用户在该页面停留的时长,我是这样做的(前端监测)_傲娇的koala的博客...
多页面应用 在多页面应用,要获取用户的停留时间还是挺简单的,看看下面几个Api??? onload (页面加载完后) onbeforeunload (页面卸载前,也就是点击叉的时候) onpageshow (页面显示的时候) on...
继续访问
[埋点] 一种Vue组件切换后停留时长的统计方法(未完全)_AlexDeng2019的...
startTime:为记录第一次进入路由组件或者进入上一个路由组件的时间。 currentTime:为记录每次路由进入的时间戳。 在前置导航守卫的 to 中进行逻辑处理。如果to存在,则说明跳转发生。 每次计算时间差时候,不要忘记再次初始化startTime。
继续访问
记录页面停留时间和遮罩层
可以记录用户在页面上的停留时间 并且还有遮罩层的效果，最小化和最大化都不影响遮罩的效果
Vue如何写埋点，统计PVUV，用户的喜爱程度、停留页面的时长
封装PVUV统计方法下面康康我在不同的情况下在页面的使用下面就是我们的最后一步，如何在axios的config.headers添加自字段 领导提出了一个需求，写pvuv要统计用户的访问量和喜好，俺也没写过，但是我们组的后台非常的强大，他总结了办法，身为前端的我只要在每次上报接口的时候顺带携带上headers头部字段即可。 ##我们直接看代码吧，这是一个在vue项目里utils封装的一个js文件，命名为PVUV.js import Cookies from 'js-cookie' //取到用户信息唯一标识
继续访问
封装一个计时器,记录页面的停留时间_a_靖的博客
vue框架实现加班统计功能 11-15 vue框架实现加班统计页面,通过子路由router来实现计时任务,把累计增加的时间放到computed组件缓存中,页面美观大气,适合整合到项目中开发和新手学习之用 如何通过视频推广的方式帮助外贸B2B企业获得询盘 最新...
继续访问
如何精确统计页面停留时长_前端瓶子君的博客
页面停留时间(Time on Page)简称 Tp,是网站分析中很常见的一个指标,用于反映用户在某些页面上停留时间的长短,传统的Tp统计方法会存在一定的统计盲区,比如无法监控单页应用,没有考虑用户切换Tab、最小化窗口等 *** 作场景。基于上述背景,重新...
继续访问
Vue项目埋点方案
Vue项目埋点
继续访问
热门推荐 如何精确统计页面停留时长
（点击上方公众号，可快速关注）作者：今日头条技术techblog.toutiao.com/2018/06/05/ru-he-jing-que-tong-ji-ye-mia...
继续访问
记录页面停留时间和遮罩层_vue记录页面停留时间-Java文档类资源...
可以记录用户在页面上的停留时间 并且还有遮罩层的效果,最小化和最大化都不影响遮罩的效果资源推荐 资源详情 资源评论 vue框架实现加班统计功能 vue框架实现加班统计页面,通过子路由router来实现计时任务,把累计增加的时间放到computed...
继续访问
记一次前端时间埋点基于vue版本的
前端页面时长埋点
继续访问
怎样统计用户在当前页面停留的时间
页面停留时间（Time on Page）简称 Tp，是网站分析中很常见的一个指标，用于反映用户在某些页面上停留时间的长短，传统的Tp统计方法会存在一定的统计盲区，比如无法监控单页应用，没有考虑用户切换Tab、最小化窗口等 *** 作场景。基于上述背景，重新调研和实现了精确统计页面停留时长的方案，需要 兼容单页应用和多页应用，并且不耦合或入侵业务代码。 虽然百度统计之类的也可以记录用户的浏览行为，但是这类统计是全部跟踪用户，而无法精确的跟踪到注册的用户之前一系列的行为，而我们只需要针对注册用户进行有目的性的行为分析。
继续访问
vue项目进行前端埋点，记录页面停留时间
数据埋点在现在的项目开发中都是不较比常见的，尤其是在电商公司，数据的统计分析尤为重要，通过数据分析可以提升用户的购买体验，方便运营和产品调整销售策略等等。埋点就是网站分析的一种常用的数据采集方法。 目前主流埋点方案 代码埋点 可视化埋点 无埋点 注：关于埋点方式的详细介绍可以看我的另外一篇文章： 常见的数据埋点方式介绍 本文主要介绍了代码埋点的方案 代码埋点分为 命令式埋点 、声明式埋点 一、命令式埋点 命令式埋点，顾名思义，开发者需要手动在需要埋点的节点处进行埋点。如点击按钮或链接后的回调函数、页.
继续访问
vue埋点 记录页面停留时间
vue记录使用日志 页面停留时间 import API from '@/modules/system/api/api_userTime' const router = new Router({ mode: 'history', base: process.env.BASE_URL, scrollBehavior: () =>({ y: 0 }), routes: constantRouterMap }) // API 保存数据接口 let startTime
继续访问
vue，用户从进入页面到离开页面，统计用户停留页面的浏览时长
data() { return { browseTime: 0, // 浏览时长初始值为 0 clearTimeSet: null, }}, methods: { setTime() { //设置定时器 this.clearTimeSet = setInterval(() =>{ this.browseTime++console.log(this.browseTime, "时长累计")
继续访问
网页记录用户在网站的浏览记录和停留时间
有针对性的对客户行为进行分析，了解用户的真正需求，所以需要记录用户的浏览信息 1、setInterval setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。 setInterval(code,millisec[,"lang"]) code必需。要调用的函数或要执行的代码串。 millisec必须。周期性执行或调用code之间的时间间隔，以毫秒计...
继续访问
uni-app相关知识点
适合新手阅读的 uni-app 知识 一、uniapp怎么进行路由跳转？ uni.navigateTo({}) 打开新页面 uni.redirectTo ({}) 当前页面出栈，新页面入栈 uni.navigateBack({}) 页面不断出栈，直到目标返回页 uni.switchTab({}) Tab 切换 二、配置tabbar（底部导航栏），在pages.json里面配置 tabbar，小程序的tabbar "tabBar":{ "list": [{ "pagePath": "pages
继续访问
捕获用户在该页面停留的时长（前端监测）
转载自： 前端大全 前言：为什么要做这个监测用户停留的呢？原因很简单，如果我们要分析这个页面对我们的产品有没有价格，那么用户浏览的时长是一个很关键的点，如果每个用户每天都在这个页面停留两个小时以上，那么我们会觉得这个页面的价值很高；如果一个页面一个月也没几个用户去浏览，那我们就会有疑问，这个页面对我们的产品还有价值吗？我们的产品后续还要保留它？这些需求都是可以让我们考虑是否要去获取用户停留时长这个功能的。 针对哪些应用？ 多页面应用 单页面应用（本文以vue为例子） 如何去获取用户停留的时长？ 在监
继续访问
uniapp 统计页面停留时间
每个页面都要统计，因此全局处理的方法较好，采用全局混入的解决方式，onHide和onUnload分别处理页面隐藏和页面卸载的情况，onShow确保每次进入页面重新获取时间 1. residenceTime.js let enterTime = ''let outTime = ''let stayTime = ''export default { data() { return { }}, onShow(){ // 用户进入时间 enter
继续访问
微信小程序-记录用户足迹
记录页面停留时间、功能点击次数 // wxml <view id="btn1" bindtap="handlerClick">点我</view>// js const { startToTrack, startByClick, startByBack } = require("../../utils/track")Page({ // 点击 tab 时用此方法触发埋点 onTabItemTap: () =>startToTrack(), // 被跳转的页面用
继续访问
js记录用户在网站的浏览记录和停留时间
by weber开发者 from http://weber.pub/ 本文地址： http://weber.pub/js记录用户行为浏览记录和停留时间/163.html 问题 公司想统计一个用户从进入官网到注册，这个流程该用户整个的浏览路线，在哪个页面停留的时间比较长，从而更有针对性的对客户行为进行分析，了解用户的真正需求。。。 虽然百度统计之类的也可以记录用户的浏览行为，但是这类统计是全...
继续访问
前端埋点实现
组件库的链接在这里主要思路还是采用的代码埋点，在每个组件的页面挂载的时候注入埋点，进行数据收集、最后提交给后端来进行长保存。1. 实现自定义hook，监测组件 代码如下： usePageListener hook主要有两个阶段：2. 收集数据 我这里主要收集了两类数据，个人相关信息的收集函数getUserIp如下： 这里是借助了搜狐的第三方接口来获取用户的IP地址和所在城市。浏览器原生的数据方法getNativeBrowserInfo如下： 这里是收集了设备、运行环境以及页面加载内存性能相关的数据，也是可以
继续访问
最新发布 前端埋点实现方案
领导今天又来活了
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）