- 博客(31)
- 收藏
- 关注
RSS订阅原创 ElasticSearch搜索
ElasticSearch搜索API该API用于在ElasticSearch中搜索内容。用户可以通过发送带有查询字符串作为参数的get请求进行搜索，或者可以在发布请求的消息正文中发布查询。搜索 api 主要是多索引、多类型的。URL搜索可以使用统一资源标识符在搜索操作中传递许多参数Q 用于指定查询字符串lenient 此参数用于指定查询字符串。只要将此参数设置为 true，就可以忽略基于 Formatbased 的错误。默认情况下它是假的。fields 此参数用国语指定查询的字符串s
2022-04-12 22:43:27
1510
原创 Vue源码解读 Day3
Vue源码解读 Day3解析 Vue $mount方法vue的$mount方法绑定在vue原型对象上。文件/src/platforms/web/runtime/index.js// public mount methodVue.prototype.$mount = function ( el?: string | Element, hydrating?: boolean): Component { el = el && inBrowser ? query(el) :
2022-04-03 23:21:31
1125
原创 Vue源码解读 Day2
Vue源码解读 Day2从构建入口web-runtime-cjs-dev resolve(‘web/entry-runtime.js’)开始解读。这个文件构建的是Runtime Only 版本。resolve(‘web/entry-runtime.js’) 这个解析的文件地址是src/platforms/web/entry-runtime.jsentry-runtime.js的内容如下，这个文件将src/platforms/web/runtime/index导出的Vue文件作为默认文件导出。i
2022-04-03 22:32:37
146
原创 Vue源码解读 Day1
Vue源码解读 Day1从源码打包入手，解读Vue源码1. 启动脚本启动脚本文件是package.json，脚本命令在“script”对象中。vue文件打包命令有三条，后两条是在第一条命令的基础上，添加一些环境参数。2. build文件发生了什么？2.1 检查是否存在用于存放打包文件的dist目录，如果没有就创建dist目录2.2 获取所有环境打包过程中的配置信息这段代码逻辑非常简单，先从配置文件读取配置，再通过命令行参数对构建配置做过滤，这样就可以构建出不同用途的 Vue.js 了
2022-03-31 23:49:28
159
原创 保障代码风格&质量
简述混乱的代码往往是令我们头疼的，特别是当我们去与他人协作开发活接手他人的项目。为了解决该问题业内慢慢推出了三个模块editorConfig、prettier、eslint。其中editorConfig和prettier是用于统一代码风格，eslint是用于提高代码品味。EditorConfig配置EditorConfig顾名思义是编辑器配置，用于跨编辑器保持同一份代码风格编辑器在启动项目时就会读取.editorconfig的配置，root = true[*]indent_style =
2021-09-02 08:11:40
195
原创 经典排序算法
排序算法冒泡排序冒泡排序（Bubble Sort）的基本思路是：每一次从待排序的数据元素中，依次比较相邻的两个元素，将比较小的数放在前面，比较大的数放在后面，直到比较到最后两个数。重复步骤，直到待排序的数据元素全部排完。这个算法的名字又来是因为越大的元素会经由交换慢慢“浮”到数列的顶端（升序或降序排列），就如同碳酸饮料重的气泡会最终会上浮到顶端一样，故名“冒泡排序”。 const bubbleSort = （arr） => { for (let i = arr.lengt
2021-06-08 14:55:19
66
原创 link与import的区别
link与import的区别link属于XHTML定义的，而@import是css提供的一种方式link标签除了可以加载css外，还可以做很多其他的事情，比如定义RSS，定义rel连接属性等，@import只能加载CSS。加载顺序存在差别：当一个页面被加载的时候，link引用的css会同时被加载，而@import引用的css会等到页面全部被下载完再加载。所以有时候浏览@import加载CSS的页面会没有样式（就是闪烁），特别是网速慢的时候很明显。兼容性存在差别：@import是CSS2.1提出的所
2021-06-08 14:53:44
340
1
原创 回流与重绘
回流与重绘浏览器的渲染过程1、解析HTML、生成DOM数，解析CSS，生成CSSOM树。2、将DOM树和CSSOM树结合，生成渲染树（Render Tree）3、Layout（回流）：根据生成的渲染树，进行回流（Layout），得到节点的几何信息（位置，大小）4、Painting（重绘）：根据渲染树以及回流得到的几何信息，得到节点的绝对像素。5、Display：将像素发送给GPU，展示在页面上。（这一步其实还有很多内容，比如会在GPU将多个合成层合并为同一个层，并展示在页面上，而css3硬件加
2021-06-08 14:53:09
132
原创 http模块
http模块若要使用 HTTP 服务器和客户端，则可以 require(‘http’)。Node.js 中的 HTTP 接口目的是支持许多传统上难以使用的协议的特性。 特别是，大块的（且可能是块编码的）消息。 接口永远不会缓冲整个请求或响应，所以用户可以流式地传输数据。HTTP 消息头由类似如下的对象表示：{ 'content-length': '123', 'content-type': 'text/plain', 'connection': 'keep-alive', 'hos
2021-06-08 14:50:48
93
原创 什么是连接池
连接池连接池是创建和管理一个连接的缓冲池的技术，这些连接准备好被任何需要它们的线程使用。英文名：Connection Pool性质：创建和管理连接的缓冲池的技术好处 这种连接“汇集”起来的技术基于这样的一个事实：对于大多数应用程序，当它们正在处理通常需要数毫秒完成的事务时，仅需要能够访问JDBC连接的 1 个线程。当不处理事务时，这个连接就会闲置。相反，连接池允许闲置的连接被其它需要的线程使用。 事实上，当一个线程需要用 JDBC 对一个 GBase 或其它数据库操作时，它从池中请求一个
2021-06-08 14:49:14
1486
原创 调制解调器
调制解调器 调制解调器，是调制器和解调器的缩写 ，一种计算机硬件，它能把计算机的数字信号翻译成可沿普通电话线传送的模拟信号，而这些模拟信号又可被线路另一端的另一个调制解调器接收，并译成计算机可懂的语言。这一简单过程完成了两台计算机间的通信。中文名：调制解调器外文名：Modem作 用：模拟信号和数字信号的“翻译员”基本定义 调制解调器是Modulator（调制器）与Demodulator（解调器）的简称，中文称为调制解调器，根据Modem的谐音，亲昵地称之为“猫”，是一种能够实现通信所需的
2021-06-08 14:46:50
2142
原创 webpack安装
webpack安装要安装最新版本或特定版本，请运行一下命令：本地安装npm install --save-dev webpacknpm install --save-dev webpack@<version>如果使用的是webpack v4或更高版本则需要安装CLI。全局安装npm install --global webpack推荐使用本地安装：这样可以在引入中断更改时更轻松地单独升级项目。不推荐使用全局安装：全局安装会锁定到特定版本的webpack，并且在使用不同版本
2021-06-08 14:44:58
130
原创 Vue源码分析-目录结构
Vue源码分析-目录结构目录结构| -------- src| --------- * --------compiler| -------- * --------core| -------- * --------platforms| -------- * --------server| -------- * --------sfc| -------- * --------sharedcompiler 目录包含Vue.js所有编译相关的代码。它包括把所有模版解析成a
2021-05-31 15:17:19
193
原创 yahoo军规
yahoo军规尽可能的减少HTTP请求数使用SDN（内容分发网络）添加Expire/Cache-control头启用Gzip压缩将CSS放在页面最上面将script放在页面最下面避免在CSS中使用Expressions把JavsScript和CSS都放到外部文件中减少NDS查询压缩JavaScript和CSS避免重定向移除重复的脚本配置实体标签（ETags）使AJAX缓存...
2021-05-20 10:30:39
105
转载 前端配色
前端配色material design palette 强大的配色网站https://www.materialpalette.com/orange/deep-orange选中某一个颜色会自动在右侧生成对应的颜色面板，功能十分强大
2021-03-24 09:33:00
1528
原创 踏上0.1+0.2不等于0.3的不归路
0.1+0.2=0.3吗？1. 在得出答案前先要考虑清楚 JS是怎么计算的？重要的事说三遍： JS内部所有的计算都是通过二进制进行计算的重要的事说三遍： JS内部所有的计算都是通过二进制进行计算的重要的事说三遍： JS内部所有的计算都是通过二进制进行计算的2. 十进制与二进制间的换算规则参考文章：http://xinzhi.wenda.so.com/a/1537180588200142权重的概念：数字中某位的权重：2的（该位所在的位数（从右至左）-1）次方比如：0的权重为：2^(1-1)=
2021-03-23 21:55:12
188
原创 扁平化设计
扁平化设计扁平化设计的发展起源可以追朔到20世纪初的“瑞士风格”这种风格强调简约，可读性，客观性。最初这种风格的呈现方式大多为海报、明信片、书籍设计等。但扁平化的出现，扩展了UI设计领域的视野。扁平化设计的特点以内容核心为主，去除不必要的高光、阴影、纹理等风格简约，多数采用单色多使用基础行状的组合注重排版，善用栅格系统扁平化设计使用扁平化设计的主要原因是因为扁平化的发展顺应时代趋势，友好支持多端，对开发更加友好，强大的可读性，易用性。在UI设计中，扁平化设计已经深入骨髓，最常用的图标
2021-03-21 22:27:27
324
原创 APP闪屏页类型
APP闪屏页类型常规闪屏页让用户体验最好的一种，用户一般感觉不到是个闪屏页，一般以品牌色+LOGO+名称+SLOGAN的形式存在，可以减少用户使用APP的等待焦虑。注：SLOGAN是宣传语广告闪屏页广告变现，引流主要通道。被大多数用户所嫌弃，设计方向需要视觉效果强，能引发用户好奇避免用户过度厌恶导致用户流失活动闪屏页与广告闪屏页相似，只有平台有相应促销活动时才会出现。加强促销效果，突出视觉与促销/互动内容。可制作固定模版，减少后期维护成本与减少用户等待。节日闪屏页每逢节假日时会出现闪屏页
2021-03-21 20:53:50
670
原创 APP卡片式设计
APP卡片式设计什么是APP卡片式设计卡片式设计灵感来源于生活中的“名片、身份证、交通卡”等卡片形式。这些卡片共同的特点是“在一张卡片容纳信息，易于扩展，灵活”。在设计中，卡片作为容器，一张卡片集中承载一种核心元素。比如购物车优点模块化，提神用户获取信息效率，卡片式设计具有将多个元素整理成一个组合且具有内容与内容区块分离的特性，让用户在翻阅中依然可以明确识别每一块内容内容与内容的分离，提升内容独立性，统一性增强视觉空间感，卡片式设计通过投影，前后颜色的深浅变化，产生视觉空间感。缺陷不
2021-03-20 14:50:47
1103
原创 APP金刚区的个人理解
什么是金刚区金刚区指的是页面上部的核心功能区、通常位于banner区以下。金刚区会随着产品业务目标变更、节日活动调整。金刚区以宫格形式排列，图标展示个数为4-10个。金刚区的作用金刚区处于App首页中最显眼，最方便点击的位置。作用是为了不同的业务模块进行引流（业务优先）功能选择，为用户提供不同功能的服务（功能优先），功能通常属于常用功能。分析：业务优先的金刚区图标会比较偏向于浮夸、热闹、炫酷（有可能无法直接从图标看出代表的意思需要看文字）。目的是吸引人去点击。功能优先的金刚区图标会
2021-03-20 11:26:43
13056
转载 浏览器缓存机制详解
什么是浏览器缓存：浏览器缓存就是把一个已经请求过的Web资源（比如html、image、js、css等文件）拷贝一份副本储存在浏览器中。缓存会根据进来的请求保存输出内容的副本。当下一个请求来到的时候，如果是相同的URL，缓存会根据缓存机制决定是直接使用副本响应访问请求，还是向源服务器再次发送请求。比较常见的就是浏览器会缓存访问过网站的网页，当再次访问这个URL地址的时候，如果网页没有更新，就不会再次下载网页，而是直接使用本地缓存的网页。只有当网站明确标识资源已经更新，浏览器才会再次下载网页。至于浏览器和
2021-03-16 22:18:59
134
原创 前端页面加载速度指数
速度指数-加载时间并非万能思考：通过加载时间来衡量页面性能仍让存在局限性，考虑以下两个极端问题。加载时间优化到极限后如何提升PV？有没有可能A页面的加载时间慢于B页面，但A页面的转化率要好于B页面。从上图可看出在相同加载时间内，下面的流程更快地显示内容，尤其是重点页面部分-对于当前这个页面最重要的是页面播放器部分。毫无疑问，更快地展现（甚至可交互的）页面内容能够提高用户停留在页面的时间。从以上可得出问题二的答案。通常页面首屏加载并呈现在浏览器视口中的内容称为“滚动之上”（abo
2021-03-16 22:06:05
547
原创 域名解析步骤
域名解析步骤浏览器会搜索浏览器自身的DNS缓存（缓存时间比较短，大概只有1分钟，且只能容纳1000条缓存）存疑：1000条缓存待确定。如果浏览器自身的缓存里面没有找到，那么浏览器会搜索系统自身的DNS缓存。如果还没有找到，那么尝试从hosts文件里面去找。注：hosts文件是一个没有扩展名的系统文件，其作用就是将一些常用的网址域名与其对应的IP地址建立一个关联“数据库”，当用户在浏览器中输入一个需要登录的网址时，系统会首先自动从Hosts文件中寻找对应的IP地址，一旦找到，系统会立即打开对应
2021-03-10 22:41:40
900
TCP为什么是三次握手
前言 三次握手是为了防止当已失效的连接请求报文段突然又传到服务端，造成双方的不一致，导致资源的浪费。TCP两次握手举例客户端向服务端发送第一次连接请求。由于网络拥塞，客户端发送的连接请求迟迟到不了服务端，客户端超时重发第二次连接请求。假设这一次服务端正确接受并确认应答，双方开始通信，通行结束后释放连接。释放连接后，客户端任务失效的连接请求抵达了服务端，由于只有两次握手，服务端收到请求就会进入ESTABLISHED状态，等待发送数据或主动发送数据。但此时的客户端早已进入CLOSED状态，服务端
2021-03-10 22:34:17
62
转载 HTTP协议详解
HTTP协议简介HTTP协议即超文本传输协议是Hyper Text Transfer Protocol的缩写。HTTP协议是一种用于分布式、协作式和超媒体信息系统的应用层协议。HTTP协议是万维网的数据通信的基础。HTTP概述HTTP是一个客户端终端（用户）和服务器端（网站）请求和应答的标准（TCP）。通过使用网页浏览器、网络爬虫或者其它的工具，客户端发起一个HTTP请求到服务器上指定端口（默认端口为80）。我们称这个客户端为用户代理程序（user agent）。应答的服务器上存储着一些资源，比如
2021-03-07 23:26:08
1271
12
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人