JSBridge 原理
介绍 如今移动端盛行的年代,技术选型基本都是混合开发(Hybrid),即结合原生 Native 与 Web H5 两者的优点同时使用这两类技术:
原生技术指 iOS(Objective C、Swift)、Android(Java):开发效率较低,发布依赖用户更新…
项目历史逻辑下线
最近在组内推广进行项目(Vue + Express)历史逻辑下线专项,实践完成后产出了一份 SOP,特此记录 删除无用路由与接口#
前置逻辑:
开启埋点 SDK PV 插件自动上报或 Vue 插件路由自动上报,注意项目初始访问是否正常上报 开启埋点 SDK 接口请求上报功能…
微信小程序启动性能优化
最近在做小程序的冷启动耗时优化,查阅了一下 小程序官方文档 后发现已经写得非常详尽细致了,这里做一下记录整理,突出开发者重点关注的部分。 启动定义#
以「用户打开小程序」为起点,到小程序「首页渲染完成」为止。
小程序「首页渲染完成」的标志是首个页面 Page.onReady 事件…
Vue 可视化模块引擎
背景 团队内营销活动及落地页需求迭代比较频繁,经过调研后在集团自研可视化平台基础上自建了更贴近团队业务特点的营销可视化搭建平台。在渲染层实现上,考虑到较多历史项目页面仍属于核心业务需要长期迭代维护,除了常规的页面框架渲染外还需要扩展支持模块级渲染…
页面到达率统计调研
背景 组内负责的产品页面主要的流量途径来自集团各 App 端内,其中业务重点关注的一个指标是到达率
到达率计算:资源位点击到页面展现 / 资源位点击
资源位点击为 Native 侧埋点,BI 会根据物料名称判断对应业务
页面展现为 Web H5 侧埋点,一般设置在 mount…
Druid 查询最佳实践
前言# Druid 是一个分布式的、支持实时多维分析的数据处理系统,既支持高速的数据实时摄入处理,也支持实时且灵活的多维数据分析查询,同时支持根据时间戳对数据进行预聚合摄入和聚合分析。
名词 含义时间戳列 数据的时间戳列…
业务侦查 - 多进程管理方案实践
背景# 组内现有的监控数据主要分为 系统日志数据 与 业务埋点数据,分布在对应两个平台上,在系统上线后或是业务高峰期时研发同学需要持续关注线上数据来预判风险,两个平台来回刷新操作频繁,体验不佳。
思考#
两个平台来回查看麻烦,可以考虑整合不同平台的数据源做处理 将主动查看变为被…
微信 H5 网页跳转小程序
使用前需知# 依赖 wx-open-launch-weapp 标签 微信 JS-SDK 版本 1.6.0+
开放对象#
已认证的服务号,服务号绑定 “JS 接口安全域名” 下的网页可使用此标签跳转任意合法合规的小程序。 已认证的非个人主体的小程序,使用小程序云开发的静态网站…
站点内嵌 VuePress 体验实践
最近在建设内部监控平台站点(React + antd),文档方面选择的是目前主流的静态内容站点生成器 VuePress,进一步考虑希望提供给用户一站式的访问体验打算将文档内容直接内嵌至站点系统中,短平快地通过 iframe 接入后遇到了两个问题,特此记录。 文档无法完全显示
具体…
微信小程序 webview 实践
最近做了不少小程序 webview 相关的需求,这里做一个总结记录 内嵌 H5 与原生小程序对比#
web-view 标签要求基础库 1.6.4+
内嵌 H5 微信小程序离线能力 低 高
页面切换体验 中 高…
Hooks 详解
在 Hooks 正式推出不久时我写了一篇 Hooks 随谈 ,主要是从概念介绍上对它的简单的一个分析理解,实习时开发的新控制台则完全使用了这个特性,因此想结合目前的实践经验对 Hooks 做一个最佳实践与对比的分析。 Capture Value#
从 Hooks 出现后…
React Fiber
React 从 v16 开始启用了全新的架构,管理代号为 Fiber 。比起之前的实现极大地提高了性能,本文将会结合一个实例整体剖析一下 Fiber 的内部架构。 概览#
先来看一个例子 :
Copy
class ClickCounter extends React…
Hooks 随谈
React 16.8 正式推出了 Hooks 的特性,这期间也从一些方面了解尝试过 Hooks,谨参考多篇文章来谈谈 Hooks 。 Hooks 可以让你不需要通过类来使用 React 的 state 以及其它特性。你也可以自定义自己的 Hooks 来在组件之间共享可复用的状态…
从零实现一个 React-Router
在实现 React 单页面应用过程中,必须掌握的一个生态就是 React-Router 路由库,本文将会从零开始实现React-Router 的关键部分。 React-Router v4 是一次颠覆性的更新,完全不兼容以前版本的写法,相比于之前更容易让人接受的配置式路由写法…
详解 CRP:如何最大化提升首屏渲染速度
在前端性能优化树上有很多值得展开的话题,从输入 URL 到页面加载完成发生了什么 这一道经典的面试题就涉及到很多内容,但前端主要关注的部分就是 浏览器解析响应的内容并渲染展示给用户 这一步,本文将会详细分析这一步的具体过程并在分析的过程中理解该如何做性能优化。 首先介绍一个名词…
从五个规则来介绍 this
在文章开始以前我们先做一道题: Copy
window.name = "window";
function User(name) {
this.name = name;
this.greet1 = function() {
console.log(this…
[译] JavaScript — 继承、委托模式和对象链接
原文地址: JavaScript — Inheritance, delegation patterns and Object linking 作者: NC Patro
学习 JavaScript (原型继承) 中的继承,行为 / 对象委托模式和关联到其它对象的对象
什么…
React 入门
本文将会从零开始介绍 React 的核心知识点,以下是参考大纲~ React
React 是什么 为什么要使用 React
项目预览 JSX Styles 组件
props
类组件
State 事件处理 生命周期
更多
脚手架 状态管理与路由
话不多说…