- 博客(122)
- 收藏
- 关注
RSS订阅原创 录音、上传、播放音频微信小程序实践
最近上线了一款智能外呼机器人产品，需要开发一款录音、上传、播放音频功能的微信小程序给录音师配置外呼话术真人录音。代码已开源，数据均已本地化处理。适合新手参考学习的完整原生微信小程序小项目。.........
2022-07-10 11:24:49
4554
6
原创 前端性能优化原理篇——Page Lifecycle
前端性能优化原理篇——Page Lifecycle文章目录前端性能优化原理篇——Page Lifecycle导读生命周期概述好奇解决的问题生命周期状态与事件状态事件跨浏览器兼容建议与实践对每个状态下的建议避免使用老旧的生命周期API数据采集上报启发与实践FAQs参考导读原文链接性能，一直都是前端孜孜不倦探讨的话题。说到生命周期想必大家都不陌生，这都是 React 、Vue 等框架设计的核心理念，它大致都提供了数据初始化、DOM 加载、资源释放等时机钩子供大家合理使用，例如 React shouldC
2021-04-23 15:07:27
1121
原创 redux 源码分析
文章目录redux 源码分析简介三大原则对比 mobx概览使用深入 reduxcreateStorebindActionCreatorscombineReducerscomposeapplyMiddlewarethunk 中间件总结redux 源码分析原文链接简介Redux 是 JavaScript 状态容器，提供可预测化的状态管理。三大原则单一数据源，创建一个 Redux st...
2020-04-06 22:39:02
310
原创 前端监控性能指标
文章目录前端监控性能指标性能指标阶段性指标关键性能指标小程序W3C Level 1兼容性常规用法注意事项1、计算HTML文档请求使用 Nav Timing2、计算静态资源使用 getEntriesByType('resource') 代替 getEntries()3、secureConnectionStart 问题4、跨域资源设置响应头 Timing-Allow-Origin5、注意属性值为 0 ...
2020-04-02 10:06:55
1184
1
原创 koa 源码分析
文章目录koa 源码分析简介概览使用例子动手实现一个精简的 koa骨架第一步，接收一个中间功能第二步，实现 context 代理第三部，接收多个同步中间件第三部，异步洋葱圈模型完koa 源码分析原文链接简介koa 是由 Express 原班人马打造的，相比 Express 的大而全，koa 致力于成为一个更小、更富有表现力、更健壮的 Web 框架，适合作为 web 服务框架的基石。koa...
2020-03-29 10:41:33
340
原创 防抖与节流：实践与勘误
文章目录防抖与节流：实践与勘误前言防抖使用场景案例节流使用场景勘误案例总结参考防抖与节流：实践与勘误原文链接前言一般对于监听某些密集型键盘、鼠标、手势事件需要和后端请求交互、修改 dom 的，防抖、节流就很有必要了。防抖使用场景关键字远程搜索下拉框resize对于这类操作，一般希望拿到用户最终输入的关键字、确定的拖拽大小，然后与服务器交互。而中间态的值，并不关心，为了减轻服...
2020-03-09 15:22:39
302
原创 源码分析：react hook 最佳实践
文章目录源码分析：react hook 最佳实践（上篇）前言2条规则为什么？源码分析useState使用方式为什么？源码分析useEffect使用方式为什么？源码分析useMemo使用方式为什么？源码分析useCallback使用方式为什么？源码分析下篇介绍源码分析：react hook 最佳实践（上篇）原文链接前言本文从 mini React —— Preact 源码的角度，分析 Rea...
2020-02-29 17:54:11
407
原创 你真的懂JS事件循环吗
文章目录任务队列 Tasks QueuerequestAnimationFrame微任务 Microtasksnodeweb worker参考原文链接对于浏览器而言，有多个线程协同合作，如下图。具体细节可以参考一帧剖析。[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-7kz0BmRm-1581224067343)(https://raw.githubuserco...
2020-02-09 12:56:26
522
原创 前端极致性能优化手册大全
文章目录前端极致性能优化手册大全webpack代码分块分析插件 webpack-bundle-analyzerglob 和 purgecss-webpack-plugin 去除无用CSS图片webp雪碧图iconfontbase64缓存DNS缓存http 缓存CDN(Content Delivery Network) 内容分发网络本地缓存 localStorage、sessionStorage、c...
2020-01-18 14:58:52
892
原创 错误监控原理解析
文章目录错误监控前言常见错误语法错误同步错误异步错误window.onerror 注意事项网络错误`window.onerror` 与 `window.addEventListener`Promise 错误上报方式Script errorJavaScript 错误剖析推荐做法SourceMap参考网站错误监控原文地址前言作为一个前端，在开发过程即便十分小心，自测充分，在不同用户复杂的操作下...
2019-12-28 16:28:33
689
原创 rollup 打包实践
原文链接简介rollup 是一款像 webpack 一样的JS代码打包工具。它特别适合类库的维护，有了它你可以把单个复杂庞大的类库拆分成多个文件模块编写，最终打包成符合UMD、AMD、ESM等格式的单个或多个文件。它可以利用最新的ES6+ modules 规范，Tree-Shaking 不需要的代码，这样你就可以放心的引入你喜欢类库中的某个方法，而不必担心引入整个类库。Vue 官方使用...
2019-10-29 16:43:55
2059
原创 性能优化——关键路径渲染优化
文章目录关键路径渲染优化什么是优化关键路径关键指标构建对象简单流程图代码准备不设置明确禁止缓存private与public缓存过期策略1、三种方式设置服务器告知浏览器缓存过期时间2、两种方式校验资源过期强制校验缓存性能优化期中总结：HTTP 缓存性能检查清单前端工程化参考附代码关键路径渲染优化什么是优化关键路径优化关键路径的就是优先显示与用户操作相关的内容，也就是常说的尽量减少白屏时间或...
2019-08-07 23:59:08
1036
原创 HTTP 缓存机制详解
HTTP CacheHTTP Cache什么是 HTTP Cache关键字简单流程图代码准备不设置禁止缓存缓存过期策略1、三种方式设置服务器告知浏览器缓存过期时间2、两种方式校验资源过期Markdown及扩展表格定义列表代码块脚注目录数学公式UML 图:离线写博客浏览器兼容什么是 HTTP Cache我们知道通过网...
2018-08-19 13:08:16
13813
2
原创 一步一步来制作3D导航栏
目标效果如下 页面结构<nav class="nav"> <a href="#"><span data-hover="Ratatouille">Ratatoui
2018-06-28 18:03:00
1194
原创 一步一步来制作CSS3 3D旋转相册
一步一步来先编写基本的页面结构body 内添加如下代码，结构：舞台，容器，图片内容<div class="stage-area"> <div class="container"&am
2018-06-24 11:36:10
34198
50
原创 js数组去重
1、遍历 + Array.prototype.indexOf 去重：var arr = [1, '1', 1, 'str', NaN, NaN, null, null, undefined, undefined];function deleteDuplicate(a) { if( Object.prototype.toString.call( a ) !== '[object Arr...
2018-05-26 02:32:38
2813
原创 元素垂直居中
效果展示： 1、CSS/** * 垂直居中 */.com {background: #58a; width: 200px; height: 100px; color: white;}.one { /* line-height + text-align 实现单行文本水平垂直居中 */ line-height: 100px; text-align: cente...
2018-02-23 16:32:04
247
原创 vue集成ueditor
1、搭建项目1、安装node2、设置全局安装路径npm config set cache "D:\app\nodejs\node_cache"npm config set prefix "D:\app\nodejs\node_global"3、设置环境变量(我的电脑右键属性->高级系统设置->环境变量)，Path：在末尾添加;d:\app\nodejs\node
2018-02-07 12:28:42
1131
原创 js 简单快排实现
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div style="width: 940px; margin: auto;"> <h4 id="original"></h4> <ol id="result"></ol>
2017-02-17 13:47:07
697
原创 一些有趣的js正则表达式
金钱数字格式化 ( 99999999 => 99,999,999 ) '99999999'.replace(/\d{1,3}(?=(\d{3})+$)/g, '$&,');删除重复相邻字符（ ‘aaabbbcdfgghhjjkkk’ -> ‘abcdfghjk’） 'aaabbbcdfgghhjjkkk'.replace(/([A-Za-z]{1})(\1)+
2017-02-16 16:25:07
532
原创 javaScript生成二维码
javaScript生成二维码改造jqueryqrcodejs使之支持中文能带logo资料搜索支持中文支持自定义logo快捷键Markdown及扩展表格定义列表代码块离线写博客浏览器兼容javaScript生成二维码（改造jquery.qrcode.js，使之支持中文，能带logo）最近公司要求使用javaScript生成二维码，在网上搜了很多相关的
2017-02-16 11:19:22
490
原创 Msql初步
安装见文章如何在Ubuntu上安装LAMP服务器系统；打开ｓｈｅｌｌ，输入一下命令连接ｍｙｓｑｌ服务器：$ mysql -u root -p # -u root表示用户 -p输入密码Enter password:*******
2015-08-30 00:58:18
419
原创 如何在Ubuntu上安装LAMP服务器系统
来自：http://tuxtweaks.com/2012/04/installing-lamp-on-ubuntu-12-04-precise-pangolin/的翻译 为何应该在Ubuntu上安装LAMP服务器？从事Web开发工作时，我更偏爱在不受干扰的情况下，在我那台计算机上的开发环境下进行开发。我宁愿 所犯的错误大部分是别人看不到的，而不是被互联网上
2015-08-30 00:14:55
573
原创 ubuntu安装Google Chrome
目前Linux下的Google Chrome浏览器有三个版本，稳定版、Beta（测试版）和Unstable（不稳定版，也就是Dev版）。其中Beta相对较稳定，而最新的功能将会 先出现在Unstable版中，经过一段测试后才会在Beta版中出现，缺点是Unstable版本更新较为频繁，稳定性也不如Beta版。如果你追求稳定的话，最好选择稳定版版，如果你喜欢尝试新功能并追求最好的性能，推荐安
2015-08-30 00:13:05
449
原创 word生成目录
一、设置标题 右键单击标题1： 点击修改：（我改的是中文黑体小三，英文小三Times New Roman） 点击格式，看进行详细设置： 一次设置标题2,、3，一般都是三级标题二、论文刷格式 光标放在需要刷标题处： 左键点击标题1
2015-08-30 00:07:58
678
原创 剪刀、石头、布
#include #include #include int main(void){ char gesture[3][10] = { "scissor", "stone", "cloth" }; int man, computer, result, ret; srand(time(NULL)); while (1) { computer = rand() % 3;
2015-08-30 00:05:07
502
原创 10161 - Ant on a Chessboard
Uvaoj10161 - Ant on a Chessboard Problem A.Ant on a Chessboard Background One day, an ant called Alice came to an M*M chessboard. She wanted to go around all the
2013-08-01 00:23:13
414
原创 10785 - The Mad Numerologist
Uvaoj10785 - The Mad Numerologist The Mad Numerologist Numerology is a science that is used by many people to find out a mans personality, sole purpose of life, de
2013-07-31 13:22:14
542
原创 123 - Searching Quickly
Uvaoj:123 - Searching Quickly Searching Quickly BackgroundSearching and sorting are part of the theory and practice of computer science. For example, binary search
2013-07-29 14:00:58
444
原创 10194 - Football (aka Soccer)
UVaoj：10194 - Football (aka Soccer) Problem A: Football (aka Soccer) The ProblemFootball the most popular sport in the world (americans insist to call it "Soccer",
2013-07-28 18:23:20
557
原创 Hdoj1879继续畅通工程
Hdoj1879：继续畅通工程Problem Description省政府“畅通工程”的目标是使全省任何两个村庄间都可以实现公路交通（但不一定有直接的公路相连，只要能间接通过公路可达即可）。现得到城镇道路统计表，表中列出了任意两城镇间修建道路的费用，以及该道路是否已经修通的状态。现请你编写程序，计算出全省畅通需要的最低成本。 Input测
2013-07-28 13:38:24
551
原创 Hdoj1875畅通工程再续
Hdoj1875：畅通工程再续Problem Description相信大家都听说一个“百岛湖”的地方吧，百岛湖的居民生活在不同的小岛中，当他们想去其他的小岛时都要通过划小船来实现。现在政府决定大力发展百岛湖，发展首先要解决的问题当然是交通问题，政府决定实现百岛湖的全畅通！经过考察小组RPRush对百岛湖的情况充分了解后，决定在符合条件的小岛间建上桥，所谓符合条件，就是
2013-07-28 13:35:13
546
原创 Hdoj1863畅通工程
Hdoj1863：畅通工程Problem Description省政府“畅通工程”的目标是使全省任何两个村庄间都可以实现公路交通（但不一定有直接的公路相连，只要能间接通过公路可达即可）。经过调查评估，得到的统计表中列出了有可能建设公路的若干条道路的成本。现请你编写程序，计算出全省畅通需要的最低成本。 Input测试输入包含若干测试用例。每
2013-07-28 00:05:28
608
原创 Hdoj1233还是畅通工程
Hdoj1233：还是畅通工程Problem Description某省调查乡村交通状况，得到的统计表中列出了任意两村庄间的距离。省政府“畅通工程”的目标是使全省任何两个村庄间都可以实现公路交通（但不一定有直接的公路相连，只要能间接通过公路可达即可），并要求铺设的公路总长度为最小。请计算最小的公路总长度。 Input测试输入包含若干测试用
2013-07-27 23:57:07
585
原创 Hdoj3788ZOJ问题
Hdoj3788：九度oj1006：Problem Description对给定的字符串(只包含'z','o','j'三种字符),判断他是否能AC。是否AC的规则如下：1. zoj能AC；2. 若字符串形式为xzojx，则也能AC，其中x可以是N个'o' 或者为空；3. 若azbjc 能AC，则azbojac也能AC，其中a,b,c为N个'o'或者为空；
2013-07-24 16:29:01
521
原创 Hdoj1716排列2
Hdoj1716：Problem DescriptionRay又对数字的列产生了兴趣：现有四张卡片，用这四张卡片能排列出很多不同的4位数，要求按从小到大的顺序输出这些4位数。 Input每组数据占一行，代表四张卡片上的数字（0 Output对每组卡片按从小到大的顺序输出所有能由这四张卡片组成的4位数，千位数字相
2013-07-23 20:59:44
615
原创 Hdoj1027Ignatius and the Princess II(全排列问题)
Hdoj1027：Ignatius and the Princess IIProblem DescriptionNow our hero finds the door to the BEelzebub feng5166. He opens the door and finds feng5166 is about to kill our pretty Prin
2013-07-23 19:57:16
635
原创 A + B Problem II
Hdoj1002：Problem DescriptionI have a very simple problem for you. Given two integers A and B, your job is to calculate the Sum of A + B. InputThe first line of the input cont
2013-07-23 16:06:08
472
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人