2018年09月_liu__software

转载 nodejs---require() 源码解读

2009年，Node.js 项目诞生，所有模块一律为 CommonJS 格式。时至今日，Node.js 的模块仓库 npmjs.com ，已经存放了15万个模块，其中绝大部分都是 CommonJS 格式。这种格式的核心就是 require 语句，模块通过它加载。学习 Node.js ，必学如何使用 require 语句。本文通过源码分析，详细介绍 require 语句的内部运行机制，帮你理...

2018-09-14 09:47:13 2730

转载 Vue.extend和Vue.component的联系与差异

(function(){ //Vue.extend()会得到一个VueComponent类，VueComponent类是Vue类的子类 var options={ //el:document.createElement('div'), //不能有el选项 template:"<div>测试{{Math.random()}}<...

2018-09-13 16:25:47 1304

转载【Vue】源码分析--vdom与html的相互转换

简析vdom是由js对象节点组成的一个树状结构，通过diff算法对比js对象节点来更新，最后映射到原生的dom中一个简单的dom结构<div id="container"> <h1 style="color: red">vdom与html相互转换</h1> <p>hello vdom and html</p&

2018-09-13 14:25:03 1125

转载 iView常用组件清空技巧

清空DatePicker（日期选择器）的方法： this.$refs.element.handleClear()清空TimePicker（时间选择器）的方法： this.$refs.element.handleClear()清空Select组件的方法： this.$refs.element.clearSingleSelect()清空Tab...

2018-09-13 14:24:43 868

转载 JS - 各浏览器对ES2015/ES6的支持情况（桌面端、移动端、以及服务器）

2015年6月， ES2015（即 ECMAScript 6、ES6）正式发布。ES2015 是该语言的一个显著更新，也是自 2009年 ES5 标准确定后的第一个重大更新。ES6 提供了许多新特性，但并不是所有的浏览器都能够完美支持。好在目前各大浏览器自身也加快速度兼容 ES6 的新特性，其中对 ES6 新特性最友好的是 Chrome 和 Firefox 浏览器。下面我对支持情况...

2018-09-13 14:21:20 12940 1

本文基于lukehoban/es6features ，同时参考了大量博客资料，具体见文末引用。ES6（ECMAScript 6）是即将到来的新版本JavaScript语言的标准，代号harmony(和谐之意，显然没有跟上我国的步伐，我们已经进入中国梦版本了)。上一次标准的制订还是2009年出台的ES5。目前ES6的标准化工作正在进行中，预计会在14年12月份放出正式敲定的版本。但大部分标准已经...

2018-09-13 14:19:54 144

转载 Vue2.0 源码阅读：模板渲染

Vue 2.0 中模板渲染与 Vue 1.0 完全不同，1.0 中采用的，而 2.0 中借鉴 React 的 Virtual DOM。基于 Virtual DOM，2.0 还可以支持服务端渲染（SSR），也支持 JSX 语法（改良版的 render function）。基础概念在开始阅读源码之前，先了解一些必备的基础概念：AST 数据结构，VNode 数据结构，的问题，render f...

2018-09-13 14:16:58 364

转载 Nginx 文件下载资源配置

下面配置是针对所有.apk文件下载本人需要.apk文件放在Linux里面作为下载, 放在/root目录下面出现403 Forbinden, (暂时不清楚), 放在其他目录正常然后新建目录/resource/apk目录把*.apk文件扔进去Nginx配置如下 location ~* (.*.apk) { add_header C...

2018-09-13 14:15:07 2162

转载 npm模块之http-proxy-middleware使用教程（译）

单线程node.js代理中间件，用于连接，快速和浏览器同步Node.js代理简单。轻松配置代理中间件连接，快速，浏览器同步等。由流行的Nodejitsu http代理提供。TL;DR代理/ api请求到http://www.example.orgvar express = require('express');var proxy = require('http-proxy...

2018-09-13 14:13:13 2451

转载反击爬虫，前端工程师的脑洞可以有多大？

1. 前言对于一张网页，我们往往希望它是结构良好，内容清晰的，这样搜索引擎才能准确地认知它。而反过来，又有一些情景，我们不希望内容能被轻易获取，比方说电商网站的交易额，教育网站的题目等。因为这些内容，往往是一个产品的生命线，必须做到有效地保护。这就是爬虫与反爬虫这一话题的由来。2. 常见反爬虫策略但是世界上没有一个网站，能做到完美地反爬虫。如果页面希望能在用户面前正常展示，同...

2018-09-13 14:09:32 165

转载解析vue2.0的diff算法

转载请注明出处本文转载至我的blog目录前言 virtual dom 分析diff 总结前言vue2.0加入了virtual dom，有向react靠拢的意思。vue的diff位于patch.js文件中，我的一个小框架aoy也同样使用此算法，该算法来源于snabbdom，复杂度为O(n)。了解diff过程可以让我们更高效的使用框架。本文力...

2018-09-12 14:59:49 119

转载深入理解 Vue Computed 计算属性

Computed 计算属性是 Vue 中常用的一个功能，但你理解它是怎么工作的吗？拿官网简单的例子来看一下：<div id="example"> <p>Original message: "{{ message }}"</p> <p>Computed reversed message: "{{ reversedMessage }}

2018-09-12 14:58:18 174

转载如何加快Vue单页加载（和打包）速度

在使用个人境外服务器运行vue项目时，会遇到打包的vendor.js过大而导致无缓存加载时，页面会空白数秒之久。解决这个问题有2个思路：1是通过压缩混淆代码、gzip实际减小代码大小；2是将部分不会改动的文件提出，放到CDN上。这里列举几种解决方案。（uglify由于vue-cli已默认包含，这里不写） #1 gzip使用gzip压缩vendor.js可以有效减小文件体积，...

2018-09-12 14:56:21 625

转载 vue-cli3静态资源static assets项目结构

今天又是纠结的一天...本文又名:vue/cli3中不得不知的webpack配置..如大家所见，我在前文也写过vue-cli3.0默认项目目录与2.0的相比，更精简:1.移除的配置文件根目录下的，build和config等目录，2.移除了static文件夹，新增了public文件夹，并且index.html移动到public中。3.在src文件夹中新增了views文件夹，用于分类试...

2018-09-12 14:55:18 19254 2

转载 vue-cli打包后的思索--代码优化

书接上文，利用http-server测试vue-cli打包后的项目。已经可以用http-server测试打包后的项目了，可是看到打包后的代码。。。.map文件第一次打包，发现打包后的文件怎么这么大，.map文件又是什么鬼？经过一顿搜索，发现js的map文件.原来map文件只是帮助我们调试用的，毕竟打包后的代码都是压缩的，调试起来很不方便。测试没问题，正式上线时，我们完全...

2018-09-12 14:54:01 208

转载 Webpack 打包优化之速度篇

在前文 Webpack 打包优化之体积篇中，对如何减小 Webpack 打包体积，做了些探讨；当然，那些法子对于打包速度的提升，也是大有裨益。然而，打包速度之于开发体验和及时构建，相当重要；所以有必要对其做更为深入的研究，以便完善工作流，这就是本文存在的缘由。Webpack Package optimization随着时间的推移，Webpack 也在不断的优化迭代；截至目前，已经更新至...

2018-09-12 14:52:26 4559

转载 javaScript中的Object.defineProperty()和defineProperties()

文章同步到githubECMAS-262第5版在定义只有内部采用的特性时，提供了描述了属性特征的几种属性。ECMAScript对象中目前存在的属性描述符主要有两种，数据描述符(数据属性)和存取描述符(访问器属性)，数据描述符是一个拥有可写或不可写值的属性。存取描述符是由一对 getter-setter 函数功能来描述的属性。Object的defineProperty和definePrope...

2018-09-12 14:50:39 367

转载 webpack build后生成的app、vendor、manifest三者有何职能不同？(1/2)

关于网友提出的“ webpack build后生成的app、vendor、manifest三者有何职能不同？”问题疑问，本网通过在网上对“ webpack build后生成的app、vendor、manifest三者有何职能不同？”有关的相关答案进行了整理，供用户进行参考，详细问题解答如下：问题： webpack build后生成的app、vendor、manifest三者有何职能不同？描述:...

2018-09-12 14:49:23 3667

转载 vue中的虚拟dom和双向数据绑定的结合

vue中的虚拟dom和双向数据绑定的结合。vue1.0中使用Object.defineProperty了双向数据绑定，使用dep进行订阅发布链接watcher和data的桥梁。这时候，一个data页面中用到几处就会在dep中添加几个函数更新相对应的dom。但是vue2.0中结合虚拟dom机制。所以没有所谓的temple中一个指令对应一个dom更新函数。而是一个组件只有一个更新函数为render。这...

2018-09-12 14:47:02 1044

转载 JavaScript 计算指定月份有多少天

用 js 画工作日历的时候，需要用 js 计算指定月份一共有多少天在网上找了些方法，都比较繁琐，后来灵机一动，想到一个偷懒的办法，分享一下一、原理分析要想得到某月有多少天，只需要获取到当月最后一天的日期就行了围绕这一思路，灵活调用 setMonth()，getMonth()，setDate()，getDate()，计算出所需日期二、代码实现function...

2018-09-12 14:45:48 479

转载 Page Visibility API（页面是否可见）

有时候不知道用户是不是正在和页面交互,是困扰web开发人员的一大问题,尤其是界面用动画或者是其它一些一直占用资源的效果时。如果页面最小化或者是隐藏在其它标签页面后(即当前不是可见的),那么有些功能可以停下来,这样更节约资源。 Page Visibility API就是为了让开发人员知道页面是否对用户可见而推出来的。 Page Visibility API本身比较简单,由以下三个部分组成。 1、...

2018-09-11 09:42:48 310

转载 js 判断当前页面是否被浏览

有次查资料的时候发现了一个有趣的title：http://www.oicqzone.com/ 根据是否被浏览，切换不同的颜文字title，非常可爱~ 然后就百度了这个知识点，接着联想此功能还可以联想到减少请求次数，节约流量等用处等等。可以通过document.hidden属性判断当前页面是否是激活状态。兼容性：IE10+，Firefox10+,Chrome14+,Opera12.1+,...

2018-09-11 09:40:26 224

转载 vue-cli项目优化，缩短首屏加载时间(二)

库使用情况 vue vue-router axios muse-ui material-icons vue-baidu-map 未优化前首先我们在正常情况下build优化1. 按需加载当前流行的UI框架如iview,muse-ui,Element UI都支持按需加载,只需稍微改动一下代码.修改前：import M...

2018-09-11 09:36:43 1621

转载 vuex直接修改state 与用commit提交mutation来修改state的差异

一. 使用vuex修改state时，有两种方式： 1）可以直接使用 this.$store.state.变量 = xxx; 2）this.$store.dispatch(actionType, payload) 或者 this.$store.commit(commitType, payload) 二. 异同点 1）共同点：能够修改state里的变量，...

2018-09-11 09:33:25 8768 1

转载 vue-vuex中使用commit提交mutation来修改state的原因解析

在vuex中，关于修改state的方式，需要commit提交mutation。官方文档中有这么一句话：更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。为了搞清楚其原因，查阅了很多资料，发现其它人在做vuex的源码解析的时候，并没有将这点说的很明白。所以只好自己去查看vuex的源码，并且自己做demo进行验证。但是试验后，发现直接修改state时，st...

2018-09-11 09:19:05 8111

转载原生Js实现复制(Copy)的方法总结，execCommand和clipboardData的使用

原生Js实现复制(Copy)的两种方法，一种是利用 clipboardData，另外一种则是用 execCommand()，今天将统一讲解一下关于他们的使用方法。 document.execCommand当一个HTML文档切换到设计模式(designMode)时，文档对象暴露 execCommand方法，该方法允许运行命令来操纵可编辑区域的内容。大多数命令影响文档的选（粗体，斜体等），...

2018-09-11 09:16:16 3220 1

转载百度搜索引擎中的特殊符号和搜索语句

双引号和书名号都属于精确匹配搜索，如果输入的关键词很长，百度在经过分析后，会将该词拆分搜索。如果您对这种情况不满意，可以尝试让百度不拆分该关键词。给关键词加上双引号，就可以达到这种效果。　　例如：搜索“百度SEO优化”，您可以测试下带上引号、不带引号搜索，效果很显著。　　下面要说的是SEO优化人员对引号的使用：　　 1、带引号搜索域名可以判断该域名会否降权，如果搜索结果第一个不是...

2018-09-11 09:14:51 20881

转载 QQ快速登录协议的分析与漏洞利用

协议验证QQ快速登录协议是本机登录了QQ的情况下可以方便的快速登录各种网页，包括QQ空间等。但是QQ的这个快捷登录功能又是如何实现的呢，毕竟浏览器上的代码没有权限和计算机上的其他应用进行交互。今天在看吾爱破解论坛的时候看到这样一篇帖子激起了我的兴趣。帖子链接：https://www.52pojie.cn/thread-591949-1-1.html 按照帖子的说法，QQ的快捷登录是通过在本地...

2018-09-11 09:12:26 2467

转载一分钟解决Chrome浏览器主页被hao123、360和2345篡改简单有效方法

当你打开浏览器看到各种首页跳转的页面，对于强迫症的我是不能接受的！各种情况都碰到了，现在给出解决方法。按照下面的方式去排查就可以一定能解决你的问题，如果不行的话你来打我呀–！。如果问题解决了希望你能推荐给其他人。(提示:检查下杀毒软件有没有绑定浏览器主页。)方式一查看chrom浏览器的快捷方式后面是否有小尾巴，去掉就可以。如下：方式二查找到源程序...

2018-09-11 09:09:19 2996

转载 Chrome浏览器如何开启隐身模式/隐身模式启动

Chrome浏览器的隐身模式或无痕浏览允许你在浏览网页时，不会在计算机上留下您访问网站的任何痕迹，包括缓存文件、Cookie、历史记录、下载记录等等，以保护用户的隐私和安全。如果您浏览网页时不想让人知道，可以使用Chrome 浏览器提供的隐身浏览模式。本文说明如何启用Chrome浏览器的"隐身"模式。方法/步骤 1 升级Chrome到最新版本参考下面经验"如何离线安装Chr...

2018-09-11 09:02:20 10946

細水、長流√的专栏