Angular-使用好NgForOf的trackBy带来性能上的提升 Angular-使用好NgForOf的trackBy带来性能上的提升官方文档,查看“变更的传导机制”即有详细的表述:即使数据没有变化,迭代器中的元素标识符也可能会发生变化。比如,如果迭代器处理的目标是通过 RPC 从服务器取来的, 而 RPC 又重新执行了一次。那么即使数据没有变化,第二次的响应体还是会生成一些具有不同标识符的对象。Angular 将会清除整个 DOM, 并重建它(就...
Redux applyMiddleware 原理剖析 Redux applyMiddleware 原理剖析最近在总结最近用的知识,好记性不如烂笔头,所以写出来记录下。“It provides a third-party extension point between dispatching an action, and the moment it reaches the reducer.”这是 Dan Abramov 对 middl...
一文掌握React性能优化 一文掌握React性能优化1 shouldeComponentUpdateshouldComponentUpdate应该是提到的优化方法里面提到最多的,使用的也是最多的,如果返回false,就会阻止下面组件的渲染,反之,返回true,就会进行接下来的渲染,默认返回的事true。但是有个问题,shouldComponentUpdate进行的是浅比较,为什么不进行深比较,因为伤不起,深比...
浮点数精度问题透析:小数计算不准确+浮点数精度丢失根源 浮点数精度问题透析:小数计算不准确+浮点数精度丢失根源在知乎上上看到如下问题:浮点数精度问题的前世今生?1.该问题出现的原因 ?2.为何其他编程语言,比如java中可能没有js那么明显3.大家在项目中踩过浮点数精度的坑?4.最后采用哪些方案规避这个问题的?5.为何采用改方案?例如在 chrome js console 中:alert(0.7+0.1); //输...
再谈js对象数据结构底层实现原理-object array map set 再谈js对象数据结构底层实现原理-object array map set如果有java基础的同学,可以回顾下《再谈Java数据结构—分析底层实现与应用注意事项》:java把内存分两种:一种是栈内存,另一种是堆内存。基本类型(即int,short,long,byte,float,double,boolean,char)在栈区分配空间,所有的对象都在堆(Heap)中分配空间。按照这思路来谈...
常见 五大CSS 布局方式 总结 常见 五大CSS 布局方式 总结之所以总结是因为最近也是在看css方面,让我迷惑的是有很多文章 关于布局名词都没有听说过,工作中也很少用。但是我们要与时俱进,叫的多了,它就成为正式名词了。比如 '双飞翼 '圣杯’??并且我还发现我几乎看了好多文章,他们在从大的角度总结时候,几乎很少有相同,分类角度不尽相同。其实这也没关系,本来就没有一个统一标准,但是还是希望有个相对能够理解 概括角度看c...
一文读懂JavaScript函数式编程重点-- 实践 总结 一文读懂JavaScript函数式编程重点-- 实践 总结好记性不如烂笔头,有时间将JS函数式编程,在JS方面毕竟有限,如果真要学习好函数式编程,建议学习下Haskell,本文就是将关于JS方面知识点尽可能总结全面。柯里化 偏应用 组合与管道 函子 Monad1. 柯里化什么是柯里化呢?柯里化是把一个多参数函数转化为一个嵌套的一元函数的过程。下面我们用介绍柯里化时候很...
一次网站的性能优化之路 -- 天下武功,唯快不破 一次网站的性能优化之路 -- 天下武功,唯快不破首屏作为直面用户的第一屏,其重要性不言而喻,如何加快加载的速度是非常重要的一课。本文讲解的是:笔者对自己搭建的个人博客网站的速度优化的经历。效果体验地址:https://biaochenxuying.cn1. 用户期待的速度体验2018 年 8 月,百度搜索资源平台发布的《百度移动搜索落地页体验白皮书 4.0 》中提到:页...
Vue + TypeScript + Element 项目实战及踩坑记 Vue + TypeScript + Element 项目实战及踩坑记前言本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 。TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript 在 2018年 势头迅猛,可谓遍地开花。Vue3.0 将使用 TS 重写,重写后的 Vue3.0 将更好的支持 TS...
一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构 一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构1.前言本文内容讲解的内容:一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构。项目地址:https://github.com/biaochenxuying/vue-family-mindmap文章的图文结合版[1]Vue-family.md[2]...
学几招 vscode 技巧 学几招 vscode 技巧俗话说「磨刀不误砍柴工」,对于开发者来说,一款优秀的 IDE 或者 text editor 能有效提升工作效率。Visual Studio Code(下文中简称 vscode)因其强大的功能,较快的运行速度以及众多的扩展,在开发者中相当流行。本文就来介绍 vscode 的一些技巧,希望能给大家一些启发。作者本人使用的 Mac 版的 vscode,一些快捷键...
如何解决 iframe 无法触发 clickOutside 如何解决 iframe 无法触发 clickOutside前言在公司的一次小组分享会上,组长给我们分享了一个他在项目中遇到的一个问题。在一个嵌入 iframe 的系统中,当我们点击按钮展开 Dropdown 展开后,再去点击 iframe 发现无法触发 Dropdown 的 clickOutside 事件,导致 Dropdown 无法关闭。查看在线示例为什么无法触发 clic...
闲话 CDN 闲话 CDN开头这篇文章通过 FCC 上海线下和成都微信的分享,整理成文字稿顺便凑一下更新,考虑到吃瓜读者们不知道都了解到啥程度,以及我科普作者的身份(自己定的),我决定从入门到放弃的介绍一下,大致涉及:什么是 CDN 为什么我们要用 CDN 访问原理 架构 应用与踩坑 现实世界的 CDN由于每个地方都事无巨细讲起来非常费劲,费劲就容易跳票,而且会导致篇幅过长,所以其...
Vue业务实践指北 Vue业务实践指北写业务,对于一个前端而言,应该是再正常不过的事了,业务对标着需求,前端 er 们根据产品的需求以及设计师的设计稿开发出相应的 web 应用,无论是一个简单的页面或是一套复杂的系统,或多或少掺杂着业务逻辑。然而,我们有时候写的业务逻辑到底是为了去写业务逻辑而写的吗,作为一个常年与业务抗战的骚 nian,我认为我们写的业务不光光是为了在排期内完成简单的任务,而是要打磨自己写...
Grafana 插件开发从零到一 Grafana 插件开发从零到一阅前高能提醒:这篇文章总的来说并不是在教你怎么开发,而是告诉你怎么去学习开发一个 Grafana 的插件,说是从零到一,MAX_VALUE 其实是 100,望珍重。引子前一阵子突然接到了一个新任务:开发一个 Grafana 的 Datasource——差不多是这个表情。作为一个新时代的好码畜,上一次配置 Grafana 面板的时候,含着热泪...
CSP:给大家介绍下我爸爸 — Performance CSP:给大家介绍下我爸爸 — Performance这篇文章主要讲如何利用 PerformanceAPI 辅助书写CSP 指令里的域名名单的思路,并不是写 CSP 的最佳实践,也未提供成熟工具。如果你还不了解 CSP 或者 PerformanceAPI,可以看下第 0 步(由于我并未特别深入 CSP 规则,如果有写的不对的地方,请大力指正),大佬请跳过。0. 名词解释C...
Event Loop 这个循环你晓得么?(附GIF详解) Event Loop 这个循环你晓得么?(附GIF详解)前言我们都知道JavaScript是一门单线程、非阻塞的脚本语言,目的是为了实现与浏览器交互。这里我们提到了两点:一是单线程,二是非阻塞。单线程是指JavaScript在执行的时候,有且只有一个主线程来处理所有的任务。但是他为什么一定是单线程,而不是多线程的呢?我们设想一下,如果JavaScript是多线程的,现...
Web 应用中的撤销与重做 Web 应用中的撤销与重做撤销(Undo)与重做(Redo)是绝大部分应用中都有的功能,它给用户提供了后悔药,这样用户即便误操作也能使损失达到最小,或者没有损失,给用户提供更好的使用体验。本文介绍 Web 应用中常用的两种撤销与重做实现思路,并提供一个在线案例。Web 应用中的撤销与重做,很容易想到富文本编辑器,但本文不特指富文本编辑器,而是更具有普遍意义的 Web 交互应用。只要有...
Cookie 知识二则 Cookie 知识二则SSO?你需要知道的SSO,即单点登录,其作用是用户登录一遍之后可在几个不同应用之间实现登录态。如当你在 A 网站登录了之后,在 B 网站也是登录状态了。实现 SSO 的方法有很多,一个要点是需要有一个标示某个用户已经登录的凭证,且该凭证能够在多个系统之间共享。使用 Cookie 保存相关的信息是一个广泛被使用的方法。那么,如何做到登录网站 A 之后,B 网站也...
Vue的打包优化之路 Vue的打包优化之路场景分析一个结构简单,依赖蛮多的可视化项目,用到的库有1. Vue + VueRouter + Vuex + axios2. ECharts + 全省份地图文件 + 中国地图文件3. ElementUI4. moment (后面被 date-fns 代替)5. lodash + lodash-decorator (用到了装饰器)EChart...