- 博客(67)
- 资源 (8)
- 收藏
- 关注
原创 代码简洁之道(译)
相同类型的变量使用相同的词Bad:Good:使用可搜索/定位的名称Bad:Good:使用解释性变量Bad:Good:避免隐式映射Bad:Good:不要添加不需要的内容Bad:Good:使用默认参数,而不是判断或条件默认参数通常更简洁。请注意,如果使用它们,函数只会为未定义的参数提供默认值。其他“假”值,如“,”,false, null, 0和NaN,将不会被默认值替换。Bad:Good:函数函数参数(理想情况下2个或更少)限制函数参数的数量是非...
2022-08-17 13:28:23 2303 1
原创 前端组件设计之实践篇
前端组件设计之实践篇前言一、组件开发流程/步骤二、组件解析1、确定组件的功能2、确定组件接收的数据;3、确定组件自身维护的状态4、确定组件的操作功能5、确定组件输出的数据三、组件实现代码实现index组件Tree组件总结参考前言在前端组件设计之理论篇中已经对前端组件设计的原则进行了介绍,本文将在实际开发过程中使用这些原则,根据自己学习理解后总结出来的组件开发的步骤进行开发实战。前端组件设计系列:前端组件设计之理论篇前端组件设计之实践篇一、组件开发流程/步骤1、确定组件的功能;2、确定
2022-05-18 07:42:16 831
原创 最全前端性能优化总结
最全前端性能优化总结前端性能优化分两部分一、加载性能优化1、减少请求次数为什么减少请求次数?减少请求次数方式2、减少资源大小减少资源大小方式3、网络优化其他二、渲染性能优化**浏览器渲染过程****重排****重绘**渲染性能优化方式三、页面加载指标API指标页面指标DevTools指标前端性能优化分两部分1、加载性能优化2、渲染性能优化一、加载性能优化本质:1、减少请求次数;2、减少请求资源的大小;3、网络优化;1、减少请求次数为什么减少请求次数?浏览器能够并行发出请求,但是每
2022-05-16 09:00:00 4539
原创 ES Module使用详解
历史上,JavaScript 一直没有模块(module)体系,**无法将一个大程序拆分成互相依赖的小文件**,再用简单的方法拼装起来。其他语言都有这项功能,比Python 的`import`,甚至就连 CSS 都有`@import`,但是 JavaScript 任何这方面的支持都没有,这对开发大型的、复杂的项目形成了巨大障碍。
2022-05-16 09:00:00 2832
原创 Tree Shaking浅谈
现在所提到的Tree Shaking都是在**ES Module**标准只上的:静态编译,确定输入输出值;Tree Shaking主要流程可以简化为:搜集依赖—>标记引用—>清除DeadCode。
2022-05-04 09:30:00 596
原创 「浏览器缓存」就这一篇
用户请求数据时首先判断是否有缓存,然后判断缓存是否过期,最后根据判断结果是否去服务器请求数据或者判断本地缓存数据是否能够继续使用···
2022-05-03 09:00:00 533
原创 「DNS」和「CDN」
「DNS」和「CDN」DNS1、递归查询:a、递归-迭代查询 b、递归-递归查询2、迭代查询本地服务器CDN1、CDN是什么2、原理分析负载均衡系统缓存代理3、总结DNSDNS(Domain Name System)服务器会首先进行域名的映射;a、浏览器DNS缓存;b、电脑本地DNS缓存;c、路由器NDS缓存;d、ISP(网络服务提供商)DNS缓存;e、你的ISP的DNS服务器会从根域名开始进行递归/迭代查询(默认使用递归查询); 本地域名服务器向根域名服务器的查询通常是采用迭代
2022-05-02 16:52:29 2502
原创 前端组件设计之理论篇
什么是前端组件?对于一个前端开发人员来说再熟悉不过了。是的,“再熟悉不过”,但是当让你尝试具体描述下呢,我想大多数人脑袋中可能只有“组件化”这三个字,其他信息都模模糊糊,根本没有一个整体和结构性的概念···
2022-04-27 09:00:00 2269
原创 npm install 到npm run xxx深度解读
npm install 到npm run xxx深度解读npm 实现思路npm文件package.jsonversiondependenciesdevDependenciesscriptbinnode_modules第三方依赖的package文件。**.bin**文件npm installpackage-lock.jsonpackage-lock.json 生成逻辑版本更新package-lock.json 被更改抽象的执行流程具体的执行流程npm run xxx参考文档npm:Bring the bes
2022-04-24 09:00:00 2244
原创 零基础专属Markdown在线编辑器开发
文章目录零基础专属Markdown在线编辑器开发1、Markdown和HTML1)名字区别2)功能区别2、Markdown转HTML1)marked.js2)Markdown转HTML展示1、定义md2html函数2、在线html内容渲染(v-html)3)MD在线编辑和HTML实时渲染4)更换MD主题5)文件保存总结零基础专属Markdown在线编辑器开发在线案例Markdown也是标记语言一种,类似HTML,和CSS没关系。我们平时使用和看到的Markdown编辑器(Typora等)显示的样式都是
2022-02-24 14:19:50 1143
原创 细讲Node软链接和硬链接
文章目录Node软链接和硬链接一、inode1、什么是inode2、inode包含信息二、软链接(soft link,也叫符号链接)三、硬链接四、软链接 vs 硬链接五、创建六、--preserve-symlinks参考Node软链接和硬链接一、inode1、什么是inode维基百科:**inode (index node)**是指在许多“类Unix文件系统”中的一种数据结构,用于描述文件系统对象(包括文件、目录、设备文件、socket、管道等)。每个inode保存了文件系统对象数据的属性和磁盘
2021-09-30 14:42:45 1356
翻译 【翻译】JavaScript中‘return await promise‘ 和 ‘return promise‘
文章目录JavaScript中'return await promise' 和 'return promise'1、Same behavior(相同的行为)2、Different behavior(不同的行为)3、Conclusion(总结)原文:‘return await promise’ vs ‘return promise’ in JavaScriptJavaScript中’return await promise’ 和 ‘return promise’当从异步函数的 promise 返回结果.
2021-09-05 11:13:49 686
原创 【TypeScript】你可能不知道的这些类型
文章目录类型SymbolTuple(元组)any(任意类型)unknown(不知道什么类型)void(没有任何类型)null(空值类型)和 undefined(未定义类型)Object、object和{}(对象类型)Never类型TypeScript的类型有很多,但是这里不会逐一进行讲解。下面列出来的几种类型,有的你可能没听过、有的你可能没用过、有的你可能用过但是不知道含义、有的你可能知道含义但是不能和其他类型区分···SymbolES6 引入了一种新的原始数据类型 Symbol ,表示独一无二的.
2021-08-23 21:44:05 642 2
原创 【TypeScript】Object、object和{}类型
文章目录Object、object和{}(对象类型)Objectobject{}/空类型总结(比较)Object、object和{}(对象类型)ObjectObject类型是所有 Object 类的实例的类型。它由以下两个接口来定义:Object 接口定义了 Object.prototype 原型对象上的属性;ObjectConstructor 接口定义了 Object 类的属性。如何理解上述两点呢?Object是一个对象,但是是包含了js原始的所有公用的功能,这个需要去了解js的原型链.
2021-08-08 16:08:39 1768
原创 【js进阶】无处不在的元编程
文章目录什么是元编程?一、自省二、自我修改三、调解四、Reflect & Proxy1、Reflect2、Proxy五、生成代码六、总结参考什么是元编程?维基百科:元编程 (meta programming)是一种编程技术,编写出来的计算机程序能够将其他程序作为数据来处理。意味着可以编写出这样的程序:它能够读取、生成、分析或者转换其它程序,甚至在运行时修改程序自身(反射)。元编程中的 元 的概念可以理解为 程序 本身,元编程关注以下的一点或几点:1、运行时修改语言结构,这种现象被
2021-06-17 14:11:52 451
原创 【实战】Webpack Plugin开发
文章目录导读一、cdn常规使用二、开发一个webpack plugin三、cdn优化插件实现1、创建一个具名` JavaScript` 函数(使用`ES6`的`class`实现)2、在它的原型上定义 `apply` 方法3、指定一个触及到 webpack 本身的事件钩子4、在钩子事件中操作`index.html`5、设置`webpack`的`外部扩展externals`6、` callback`;四、cdn优化插件使用configureWebpack中配置:chainWebpack中配置:五、小结文章参考.
2021-01-19 20:43:07 670 2
原创 【js进阶】手写call、apply、bind
关于this的指向性和执行上下文等问题本人也写过相关文章对其进行详细的解析,但是这些文章中好像遗忘了什么?对,那就是如何改变this指向的作用域,所以也就引出今天的主角——call、apply、bind;这“三兄弟”是Function原型上的三个改变调用函数作用域/上下文的函数,具体如何使用可以直接查看MDN,今天只研究如何实现这三种方法。一、call的实现 call()方法:让call()中的对象调用当前对象所拥有的function。例如:test.call(obj,arg1,arg2,···)
2021-01-16 17:42:25 293 1
原创 【实战】让微信小程序开发如鱼得水
关于微信小程序开发一直想写一篇相关的文章总结和记录下,结果拖延症犯了迟迟没有下笔;这不最近天气不错,于是找一个空闲的下午将这篇文章输出下(好像跟天气没啥关系????),那我们就开始吧!注意:本文默认开发者对微信小程序开发有一定语法基础。小程序开发文档微信小程序小结 在接触的微信小程序开发过程中,不难发现微信小程序为了方便开发人员入手对很多底层api进行了很好的封装,比如针对接口请求的wx.request(),针对路由跳转和页面导航的wx.switchTab、wx.navigateTo···等。虽
2021-01-10 19:23:12 3149 11
原创 【实战】项目模板管理脚手架ptm-cli开发详细记录
文章目录一、ptm-cli 使用说明1、特点2、安装3、使用1)基础帮助命令2)添加模板/项目3)编辑模板/项目4)查看模板/项目5)删除模板/项目6)基于模板新建/初始化项目二 `ptm-cli` 脚手架开发1、知识储备1)commander2)inquirer3)git-clone4)chalk5)ora6)rimraf2、初始化项目3、功能开发1)ptm(脚手架命令提示)分析:代码(ptm.js):2)ptm-add(添加模板)分析:代码(ptm-add.js):3)ptm-list、ptm-del、
2020-12-26 16:38:08 400
原创 【js进阶】好简单的闭包讲解呀w(゚Д゚)w
文章目录一、什么是闭包二、函数引用外部变量后的闭包三、循环中闭包让人很意外四、闭包的性能五、小结一、什么是闭包 MDN中对闭包有以下定义:一个函数和对其周围状态(lexical environment,词法环境)的引用捆绑在一起(或者说函数被引用包围),这样的组合就是闭包(closure)。也就是说,闭包让你可以在一个内层函数中访问到其外层函数的作用域。在 JavaScript 中,每当创建一个函数,闭包就会在函数创建的同时被创建出来。从上述定义中我们可以总结出4点(重点):1、闭包是在.
2020-12-19 22:07:14 210 1
原创 【web】节流、防抖,傻傻分不清楚!
文章目录一、介绍二、防抖(dobounce)三、节流四、loadsh.js中的应用_.debounce_.throttle五、总结一、介绍 防抖和节流是开发中针对高频触发事件而产生的频繁请求,进行执行次数限制,从而避免不必要的资源请求、减轻程序负担、优化用户体验的两种解决方案。例如现在很多网站的搜索输入框都有输入后相关资源列表提示的功能,如果每次键盘输入就相关资源请求,那样可能会产生很多频繁的请求,因此,一般都会运用防抖或者节流进行限制。其他的实例还有窗口的resize、scroll,输入框内容校验.
2020-12-12 15:35:23 789 1
原创 【web】懒加载 so easy!
文章目录一、前言二、关联知识点1、HTML5的`data-*`2、防抖和节流二、`getBoundingClientRect()`实现懒加载1、API介绍2、懒加载实现三、`IntersectionObserver`实现懒加载1、API2、懒加载实现四、css属性loading实现懒加载1、API2、懒加载实现五、总结一、前言什么是懒加载?懒加载顾名思义,相对于正常资源的加载显得不那么勤快;只会在页面中需要用的时候才去加载相应资源,这样的好处是能够减少页面加载时的不必要的请求,减轻浏览器请求负担,.
2020-12-06 15:52:16 668
原创 【js进阶】全面理解Event Loop这一篇就够了
文章目录一、前言一、前言event loops隐藏得比较深,很多人对它很陌生。但提起异步,相信每个人都知道。异步背后的“靠山”就是event loops。这里的异步准确的说应该叫浏览器的event loops或者说是javaScript运行环境的event loops,因为ECMAScript中没有event loops,event loops是在HTML Standard定义的。...
2020-12-05 22:45:17 9318 11
原创 【js进阶】你以为的深拷贝真的拷贝深吗
文章目录一、前言二、浅拷贝三、深拷贝1、JSON 对象中的 parse 和 stringify2、递归深拷贝四、首层浅拷贝一、前言 既然查询js拷贝相关的内容,那么就自作主张的认为屏幕前的你已经知道js的基本数据类型和引用数据类型,这里也就不再过多讲解。我们只需知道对于基本数据类型的拷贝实质是数据值的拷贝,并没有深浅拷贝的区别;浅拷贝和 深拷贝 针对的是JS中的引用类型,浅拷贝复制数据的引用地址,修改拷贝后的数据,原数据也会随之改变。只有深拷贝才是真正地对数据的拷贝,并且不会影响到原数据。二、浅拷
2020-11-28 21:01:40 190
原创 【js进阶】这应该是最简单的 this 指向解析了!
文章目录 现在已经0202年了,大家大多都富裕,能够用上ES6新特新了,所以对于this的指向问题也没有ES5时期关注了;再者,一般的开发过程中对于函数或者作用域的层级也没有嵌套太深,所以也不常遇到因为this指向不明产生的错误。常在河边走哪能不沾水,接触的项目多了,难免会遇到一些老代码,最好能够了解一下this的指向;再退一步说,面试中this指向可是避不开的点!但是,看到这篇文章只需要记住一句话就能解决所有this指向问题——this永远指向离它最近的调用对象!...
2020-11-08 11:39:54 203 2
原创 【js进阶】执行上下文、变量提升、函数提升
执行上下文、变量提升、函数提升欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何
2020-11-03 10:12:06 337 4
原创 [实战]:UniApp开发小程序怎么可以这么简单!
文章目录不会真的有前端不知道uniapp吧?!初试uniapp,爱了爱了前提涉及内容开发1、uniapp新建项目2、新建页面3、页面布局4、高德地图定位与pois获取5、uniapp中字体图标的使用6、微信小程分享完整页面代码项目代码获取我终于终于用上了uniapp!!!为什么发出这样的感叹呢?uniapp从诞生到现在已经有两年了吧,这两年间断断续续听到过uniapp的声音,但是一直没有兴趣去尝试下,总的原因有一下几点:1、开始阶段,相对于vscode,HbuilderX简直就是个弟弟,体验差,小b
2020-10-25 13:26:41 13478 12
原创 [实战]:原来搭建个人博客可以这么简单!(1小时速成)
文章目录1.知识储备2.快速上手3.建立项目结构4.快速部署和发布大家先看看完成后的大致效果 goodloving的个人博客(https://goodloving.github.io/) ,当然,该博客也可以在项目中查看。博客中也会定期更新一些知识点和一些不同的项目教程,同时大家有兴趣也可以关注本人的个人公众号 迟亦早 ,内容会同步发布!该实例简单易懂,能够实现快速建立个人博客和说明文...
2020-05-07 12:56:47 769
原创 [web]:node/js自带的异步写法callback/EventEmitter以及Generator
文章目录一、callback函数二、EventEmitter(发布订阅模式)三、Generator生成器函数四、小结一、callback函数 回调就是一个函数的调用过程。那么就从理解这个调用过程开始吧。函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b,那么这个过程就叫回调。直接上代码:/** * node自带的异步写法::: * callback函数 */fun...
2019-10-18 16:37:30 402
原创 [vue]:vue前端和node后端、通过nginx的服务器配置
文章目录1、vue项目的配置2、nginx的下载和配置3、服务器node后端服务和nginx代理开启1、vue项目的配置 对于vue/cli3.x及以上版本的vue项目,其缺少配置文件,需要自己手动添加,在 该文章 中有部分说明,主要应对请求跨域的问题。对此根目录下新建vue.config.js:module.exports={ devServer: { proxy: { ...
2019-10-10 15:20:14 2409
原创 [web]:async、await与promise
文章目录一、Promise详解二、async和await详解三、总结与分析一、Promise详解Promise是对异步编程的一种解决方案 Promise是一个构造函数,自身有all、reject、resolve这几个方法,原型上有then、catch等方法。Promise的构造函数接收一个函数作为参数,并且在函数中传入两个参数:resolve,reject,分别表示异步操作执行成功后的回调...
2019-09-22 19:10:20 274
原创 [Vue五]:vue和echarts结合,echarts图表自适应问题
[Vue五]:vue和echarts结合,echarts图表自适应问题
2019-09-01 13:21:33 19445 4
原创 [Vue四]:node.js后端响应请求并返回数据——以登录响应为例
文章目录一、须知知识点二、在项目中安装依赖框架三、编写api对前端请求给与反应一、须知知识点1.node.js编程2.express框架3.body-parser中间件,解析post请求4.隐藏知识点:前端Vue及相应框架实现对对后端的访问请求([Vue二]:实现页面登录功能对element-ui,vue-router,axios,vuex的学习和掌握)二、在项目中安装依赖框架1.项...
2019-08-24 22:35:27 2558 2
原创 [Vue二]:实现页面登录功能,element-ui,vue-router,axios的学习
文章目录一、须知知识点二、在项目中安装依赖框架三、对登陆界面的设计四、利用axios请求后端是实现登录验证一、须知知识点1.vue项的建立及基本逻辑2.element-ui基本知识--------vue的一个开源UI框架3.vue-router基本知识--------vue实现路由跳转的框架4.axios基本知识--------vue实现异步数据获取的框架5.vuex基本知识-----...
2019-08-21 21:17:02 6356 2
linux学习资料+连接软件
2018-12-12
javaweb详细笔记,绝对详细(内含代码)
2018-12-12
python爬取豆瓣每个账户对电影的评分和影评,绘制评分饼图和影评词云图
2018-04-14
python爬虫关于ip代理池的获取和随机生成
2018-04-14
最全面的DataSet用法详细
2017-08-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人