- 博客(54)
- 资源 (3)
- 收藏
- 关注
RSS订阅
原创 vue响应式原理源码：带你一步精通vue
vue3.0正式版都快发布了，vue2.0的响应式原理你还写不出来？本文带你彻底理解vue响应式原理，带你写一个简易版的vue，实习vue数据响应式（数据劫持结合发布者-订阅者）、数组变异方法、编译模板（常用的指令如v-html、v-text、v-model、v-on等）、双向数据绑定的功能。
2020-05-07 15:29:06
11431
18
原创 重新审视SSE服务器发送事件：ChatGPT流式输出效果
服务端发送事件（SSE）技术早在很久以前就已存在，但其在实际应用场景中并不十分常见。随着ChatGPT的出现，SSE技术得到了重新关注并被广泛应用于实现流式输出。本文将介绍SSE技术的使用
2024-02-25 16:17:57
936
原创 CSS 格式化上下文详解
CSS格式化上下文CSS 中很重要的一环就是 BFC 块级格式化上下文，本文整理了 CSS BFC 的相关知识，建议沐浴更衣后食用。在正式讲解BFC之前，先了解一下浏览器外边距重叠的问题。外边距重叠MDN：块的上外边距(margin-top)和下外边距(margin-bottom)有时合并(折叠)为单个边距，其大小为单个边距的最大值(或如果它们相等，则仅为其中一个)，这种行为称为边距折叠。注意：外边距重叠都是发生在块级元素中，设定 float 和 position=absolute 的元素不会产
2022-04-11 16:02:27
671
原创 大厂常问：输入URL到显示页面的全过程（敲详细）
你到现在都不知道从浏览器地址栏输入URL到显示页面的发生了什么嘛？我来教你，还有谁如果再说前端简单，你就拿这个面试题怼他！
2020-07-08 18:42:06
22962
6
原创 Promise源码分析（附带Promise的正确打开方式）
你还在被大佬按在地上摩擦吗？我教你Promise底层原理，让你感受一下完虐大佬的感觉。fell 倍儿爽！
2020-07-05 14:46:25
3537
4
原创 Flex弹性盒子详解：从量变到质变的理解
什么？你竟然不知道css的flex弹性盒子？你肯定是经常被大佬按在地上摩擦吧。这篇文章，让你彻底明白flex弹性盒子的每个属性，好文字不如好图片！
2020-06-30 15:13:35
7820
18
原创 Zookeeper学习提纲：助你一臂之力
ZooKeeperZooKeeper：ZooKeeper是一种分布式协调服务，用于管理大型主机。分布式应用：分布式应用可以在给定时间（同时）在网络中的多个系统上运行，通过协调它们以快速有效的方式完成特定任务分布式应用有两部分：Server（服务器） 和 Client（客户端） 应用程序。服务器应用程序：实际上是分布式的，并具有通用接口，以便客户端可以连接到集群中的任何服务器并获得相同的结果。客户端应用程序：是与分布式应用进行交互的工具。分布式应用的优点：可靠性：单个或几个系统的故障不会使
2020-06-25 15:31:55
2497
原创 HBase学习提纲：助你一臂之力
HBase简介： HBase是一个高可靠性、高性能、面向列、可伸缩的分布式存储系统。可在廉价PC Server上搭建起大规模结构化存储集群。HBase利用Hadoop HDFS作为其文件存储系统，利用Hadoop MapReduce来处理HBase中的海量数据，利用Zookeeper作为协调工具。 HBase与传统数据库（RDBMS）的最大区别面向列。操作数据库，如果是索引访问用HBase+Hadoop当前市场上有很多类似的序列化系统，如Avro、Google 的 Protocol Buffers、F
2020-06-25 15:30:02
3132
6
原创 JavaScript的骚操作：防抖、节流、柯里化等
JavaScript中有很多骚操作，如深克隆，防抖，节流，柯里化，单参管道函数等等，如果你连这些都不会，你怎么在大佬面前装逼？这篇文章，整理了常见的骚操作。
2020-06-16 14:44:18
2835
8
原创 java代码30行实现用我爱你重绘女朋友美照（我对你的爱，在每一个字里行间）
java代码还能表白？我来教你30行代码，用我爱你来绘一张女朋友的照片，程序员的强势浪漫，我对你的爱，在每一个字里行间。
2020-05-24 16:11:14
16601
69
原创 初识React和JSX语法：带你走入React世界,让你彻底明白JSX语法
React 库可以说是大厂中用到的最多的一个库了，我们先来简单了解一下 React 和 React 中的要用到的 JSX 语法吧
2020-05-13 20:14:57
907
原创 vue中的vuex状态管理：从入门到精通
Vuex当我们的应用遇到多个组件共享状态时，单向数据流的简洁性很容易被破坏：多个视图依赖于同一状态。来自不同视图的行为需要变更同一状态。对于问题一，传参的方法对于多层嵌套的组件将会非常繁琐，并且对于兄弟组件间的状态传递无能为力。对于问题二，我们经常会采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。以上的这些模式非常脆弱，通常会导致无法维护的代码。什么情况下我应该使用 Vu...
2020-04-26 12:55:48
1210
2
原创 vueRouter路由详解：从入门到精通
Vue-Router什么是路由？路由是根据不同的url地址展现不同的内容或页面。早期的路由都是后端直接根据url来重载页面实现的，即后端控制路由。后来页面越来越复杂，服务器压力越来越大，随着ajax（异步刷新技术）的出现，页面的实现非重载就能刷新数据，让前端也可以控制url自行管理，前端路由由此而生。什么时候使用前端路由？前端路由更多用在单页应用上，也就是SPA(Single Page W...
2020-04-26 12:53:01
3631
1
原创 vue组件和父子组件间通信的13种方式（包含动态、异步组件和常用的prop、$emit、插槽等）
本篇文章分成了两个部分，第一部分是组件基础，介绍全局组件、局部组件的注册，动态组件和异步组件的使用等等，第二部分是组件之间的通信方式，本文整理了13种，在下面依次介绍。文章较长，看的时候要有耐心哦~组件基础我们在制作一个网站的时候，通常会用到代码相同的部分，比如说导航栏，如果不能很好的复用，那么就会导致大量重复代码，不好维护，vue中的组件，很好的解决了这个问题，什么是组件呢？组件是可复用...
2020-04-13 08:31:10
2046
1
原创 JavaScript中的事件循环机制：你不得不懂的JS原理
事件循环学过JS的都知道，JS是单线程的，即使html5中提出了woker，但它依旧在主线程的控制之下，只能进行计算任务，而不能操作dom等，所以worker并没有改变JS是一个单线程这一机制。单线程即是后一个任务必须要等待前一个任务执行完毕才能执行，如果执行像setTimeout延迟器，亦或者异步任务等，都不会消耗cpu，就会有空等的情况，为了更好的协调事件、脚本、UI渲染等行为，于是有了事件...
2020-04-11 12:32:58
1052
2
原创 抖音上的时钟屏保，被我改造完用来表白
抖音上很火的时钟屏保，被我改造完后用来准备准备准备表白，谁说程序员不浪漫？！闲言少叙，书归正文，因为gif格式的图片只能上传5M，所以我只能切成两块，中间还删减了一些，大家凑合着看，不要打我，大家可以把源码拷下来，源码在最下面，自己运行康康，嘿嘿，话不多说，上图：效果主要分成了三个部分，第一个是进入页面的时候平铺的时钟效果，当点击按钮的时候，变为圆盘时钟，左边的文字以键盘敲击的而方式出现...
2020-04-08 09:12:27
13467
72
原创 vue的生命周期详解：从入门到精通
Vue生命周期在学习vue的过程中，vue的生命周期可谓是重中之重，必学的一部分。每个 Vue 实例在被创建时都要经过一系列的初始化过程，例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。下面这张图想必大家都不陌生生命周期图示：解释：首先创建一个vue实例，...
2020-04-06 17:55:10
5320
6
原创 axios在企业级vue项目中的应用（附带axios正确打开方式）
在一个大型的vue项目中，需要编写请求接口实在太多太多了，如果每一个接口都从创建实例开始，那代码将会相当庞大以及十分臃肿，后期很难维护，那我们来看看企业级项目中，http请求是怎么抽离出来的吧。首先是request.js，这个文件是用来处理axios的配置、设置拦截器等等，它创建了一个实例，并将这个实例导出。代码如下，注释都写在里面啦import Vue from 'vue'import ...
2020-04-01 09:19:11
7926
6
原创 一篇文章带你“深入”了解vue的计算属性computed和侦听属器watch
计算属性computed设计插值表达式的初衷是为了简单运算的。但在模板中放入太多的逻辑会让模板过重、难以维护且难以阅读。例如：<div id="example"> {{ message.split('').reverse().join('') }}</div>在这个地方，我们很难一眼看出来这个是想要得到反转的字符串，如果我们有十个地方需要用到这种反转字符串，就...
2020-03-31 16:04:21
1061
原创 钢铁程序员写给女朋友的情话
谁说程序员不可以浪漫了？！我收集了各种各样的情话，以及特别篇（如吵架、女生来大姨妈等正确处理方案）。以后尽量每月一更，做个文艺情怀程序员，哈哈哈哈。情话并非自创，各处收集的，侵删第一回现在的我就像一只谨慎的兔子壮着胆子喜欢你你只是一个不耐烦的表情我就红着眼睛想逃回森林第二回有一种鲸鱼，发出的声音与其他的鲸鱼都不一样频率为52赫兹，因此永远得不到回应被称为世界上最孤独的鲸鱼...
2020-03-29 22:07:59
3039
原创 vscode下载和前端工程师常用的20+插件，包含代码提示、语法高亮、括号颜色等等
这里附带vscode下载地址，和前端开发常用的20+插件，可根据插件功能自行选择下载。VsCode下载安装Visual Studio Code下载地址：https://code.visualstudio.com/Download下载页面中，用户可选择“user”和“system”两种版本。目前“system”被推荐使用，它能同时打开多个窗体副本，而“user”只能打开一个实例。VsCo...
2020-03-29 20:57:02
9607
原创 vue中插值表达式和14个vue指令详解
在学习vue时，插值表达式和vue指令可谓是基础中的基础，这篇文章，就让你彻底了解怎么使用插值表达式和vue中所有指令的用法。一、插值表达式：{{ }}可以将vue中的数据填写在插值表达式中<div id="app">{{ title }}</div><script> const vm = new Vue({ el:"#app"...
2020-03-29 15:27:28
8199
原创 好似大家都在用vue，vue好在哪？
好似周围的人都在使用vue，那么vue到底好在哪呢，我虽然用了好多次，但是也是第一次停下来，整理了一下vue 的优点性能更好视图-模型分离，实现双向数据绑定维护成本低1、性能好在哪？在JavaScript中，操作DOM影响性能，操作DOM是十分昂贵的，因为访问DOM会消耗性能，而修改DOM可能导致重排或者重绘，代价更是可怖。DOM是一个与语言无关的API，它在浏览器中的...
2020-03-22 15:36:18
2728
原创 企业级项目：webpack中的性能优化
webpack性能优化概述很多很多人都认为性能是一个项目必不可少的，我总结了有关webpack构建项目中的性能优化的几个方面。在了解性能优化之前，最好对webpack编译原理有所了解，方便更深入的学习。可以参考：大神眼中的webpack构建工具：对编译原理的分析本文中性能优化目录：构建性能：是指在开发阶段的构建性能，而不是生产环境的构建性能，尽可能提高开发效率减少模块解析：优化lo...
2020-03-17 17:10:24
1105
原创 webpack+nginx实现gzip压缩解决vue首屏加载过慢
webpack+nginx实现gzip打包解决vue首屏加载过慢B/S结构中的压缩传输浏览器向服务器发出请求，并且在请求头中声明可以使用gzip的编码格式，服务器接受到请求之后，读取未压缩的文件，并进行gzip算法压缩，服务器压缩完成后，再返回给浏览器gzip格式的文件，浏览器进行解压缩。这样做传输效率可能得到大幅提升，但是服务器的压缩需要时间，客户端的解压需要时间所以我们再使用gzip的...
2020-03-17 16:57:07
789
原创 webpack-dev-server开发服务器 和 webpack中常用plugin和loader
webpack-dev-server：开发服务器在开发阶段，我们希望把最终的代码和页面部署到服务器上来调试是否有bug，如果我们的代码不能实现热加载的话，那会对开发效率产生极大的影响，我们所有的时间，可能都浪费在打包、运行、调试过程了。webpack-dev-server就是一个热加载的模拟服务器。我们要使用webpack-dev-server，先要安装npm install --D we...
2020-03-17 16:52:27
808
原创 babel：对ES2015+的语法转换为浏览器兼容的语法
babel的安装和使用官网：https://babeljs.io/民间中文网：https://www.babeljs.cn/babel简介因为不同版本的浏览器能识别的ES标准并不相同，就导致了开发者面对不同版本的浏览器要使用不同的语言，例如ES2015,ES2017,ES2018…等等。为了能够把不同标准书写的语言，编译为统一的、能被各种浏览器识别的语言，这就是babel的作用由于...
2020-03-16 16:05:21
1266
原创 css工程化解决类名冲突、重复样式等问题
CSS工程化在前端的不断发展，css也出现了很多问题，类名冲突、重复样式定义、css文件需要细分等问题。这篇文章我们来依次介绍如何解决这些问题的。1、命名约定：BEM规范BEM是一套针对css类样式的命名方法。其他命名方法还有：OOCSS、AMCSS、SMACSS等等BEM全称是：Block Element Modifier一个完整的BEM类名：block__element_mod...
2020-03-16 14:27:23
4758
原创 十分钟带你学会Less预编译器
CSS预编译器 Less我们在书写css样式的时候经常会被权重给恶心到要吐血。所以预编译器应运而生。预编译器它就是使用一种更加优雅的方式来书写css代码，通过编译器，将其转换为可以被浏览器识别的传统css代码目前，最流行的预编译器有LESS和SASS，由于它们两者特别相似，我们在这里介绍Lessless官网：http://lesscss.org/sass官网：https://sass-...
2020-03-16 14:20:47
1668
1
原创 史上最全 nginx.conf 配置文件详解
直接上代码了具体看中文文档 https://www.nginx.cn/doc/index.html在这里插入代码片#定义Nginx运行的用户和用户组 # user nobady nobady;#nginx进程数，建议设置为等于CPU总核心数,默认为1。 worker_processes 8;#全局错误日志定义类型，[ debug | info | notice | warn...
2020-03-10 21:47:02
975
1
原创 大神眼中的webpack构建工具：对编译原理的分析
想要成为一名资深的前端工程师，webpack构建工具可谓是不可不知，一篇文章，让你从webpack一窍不通的小白，到熟知webpack编译原理的大神
2020-03-10 21:23:45
2497
5
原创 包管理工具npm、yarn以及nvm简介及简单使用
在使用npm、yarn等包管理工具之前，我们首先了解一些基本的概念模块（module）通常以单个文件形式存在的功能片段，入口文件通常称之为入口模块或主模块库（library，简称lib）以一个或多个模块组成的完整功能块，为开发中某一方面的问题提供完整的解决方案包（package）包含元数据的库，这些元数据包括：名称、描述、git主页、许可证协议、作者、依赖等等版本号：主版本号.次版...
2020-03-09 20:03:51
2351
原创 Git简介以及简单使用
Git简介我们都知道Git是用来做版本控制的，那么到底什么是Git，如何使用Git。下文记录着我的学习过程。我们先了解几个常用的概念：版本控制（version control）：在我们日常开发过程中，总是要对文件做出修改，每次修改后的文件，就相当于一个新版本，而把这一次次修改的文件记录下来，可以对新版本、旧版本进行操作，就是所谓的版本控制。版本控制系统：用来记录一次次版本，并可以对...
2020-03-08 19:51:08
529
原创 模块化之CommonJs、AMD、CMD和ES6模块化
模块是将一个复杂的程序依据一定的规则(规范)封装成几个块(文件), 并进行组合在一起。块的内部数据与实现是私有的, 只是向外部暴露一些接口(方法)与外部其它模块通信模块化有两个重要的概念：模块的导出和模块的导入模块的导出：暴露接口的过程即模块的导出模块的导入：当通过某种语法或API去使用一个模块时，这个过程叫做模块的导入1、CommonJS因为CommonJs是node服务提...
2020-02-26 19:33:40
594
原创 Fetch概述-升级的网络请求
1、fetch()接口XMLHttpRequest的问题所有的功能全部集中在同一个对象上，容易书写出混乱不易维护的代码采用传统的事件驱动模式，无法适配新的 Promise ApiFetch Api 的特点并非取代 AJAX，而是对 AJAX 传统 API 的改进精细的功能分割：头部信息、请求信息、响应信息等均分布到不同的对象，更利于处理各种复杂的 AJAX 场景使用 Promi...
2020-02-23 19:50:54
421
rotate-cube.zip
2020-04-22
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人