chenogeの日志


  • 首页

  • 归档

  • 搜索

版权格式

发表于 2018-07-08

从法律角度看,版权保护是随着作品的问世的即刻就得到版权的保护的,并不是必须要声明。但是作为惯例,这一小行文字还是有很好加强意识,提醒浏览者,所观看的内容是受到版权保护的。

正确的格式应该是:

1
Copyright [dates] by [author/owner]

© 通常可以代替Copyright。 All Rights Reserved 在某些国家曾经是必须的,但是现在在大多数国家,都不是法律上必须有的字样。


阅读全文 »

编写一个简单的JavaScript模板引擎

发表于 2018-07-05

模板

1
2
3
4
5
<ul>
<% for ( var i = 0; i < users.length; i++ ) { %>
<li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
<% } %>
</ul>


阅读全文 »

javaScript运行机制,从浏览器多进程到JS单线程

发表于 2018-07-04

区分进程和线程

线程和进程区分不清,先看看下面这个形象的比喻:

1
2
3
4
5
6
7
8
9
- 进程是一个工厂,工厂有它的独立资源

- 工厂之间相互独立

- 线程是工厂中的工人,多个工人协作完成任务

- 工厂内有一个或多个工人

- 工人之间共享空间

再完善完善概念:

1
2
3
4
5
6
7
8
9
- 工厂的资源 -> 系统分配的内存(独立的一块内存)

- 工厂之间的相互独立 -> 进程之间相互独立

- 多个工人协作完成任务 -> 多个线程在进程中协作完成任务

- 工厂内有一个或多个工人 -> 一个进程由一个或多个线程组成

- 工人之间共享空间 -> 同一进程下的各个线程之间共享程序的内存空间(包括代码段、数据集、堆等)
阅读全文 »

javaScript易忽略语法集

发表于 2018-07-04

箭头函数与this

箭头函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象 。

this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this。正是因为它没有this,所以也就不能用作构造函数。 箭头函数转成 ES5 的代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// ES6
function foo() {
setTimeout(() => {
console.log('id:', this.id);
}, 100);
}

// ES5
function foo() {
var _this = this;
setTimeout(function () {
console.log('id:', _this.id);
}, 100);
}


阅读全文 »

雅虎前端优化的35条军规

发表于 2018-07-03

内容部分

1.尽量减少HTTP请求数

页面大部分的响应时间都在下载页面上的各种组件:图片,样式表,脚本等等。减少组件数必然能够减少页面提交的HTTP请求数。这是让页面更快的关键。

合并文件是通过把所有脚本放在一个文件中的方式来减少请求数的,当然,也可以合并所有的CSS。

CSS Sprites是减少图片请求数量的首选方式。把背景图片都整合到一张图片中。

行内图片(Base64编码)用data: URL模式来把图片放在(缓存的)样式表中。


2.减少DNS查找

DNS是有成本的,它需要20到120毫秒去查找给定主机名的IP地址。在DNS查找完成之前,浏览器无法从主机名下载任何东西。

DNS查找数等于页面上不同的主机名数,包括页面URL,图片,脚本文件,样式表等等组件中的主机名,减少不同的主机名就可以减少DNS查找。

HTTP客户端一般对同一个服务器的并发连接个数都是有限制的 。减少不同主机名的数量同时也减少了页面能够并行下载的组件数量,削减了避免DNS查找的响应时间,而减少并行下载数量却增加了响应时间。我的原则是把组件分散在2到4个主机名下,这是同时减少DNS查找和允许高并发下载的折中方案。


阅读全文 »

拦截全局ajax请求与Ajax-hook源码分析

发表于 2018-07-03

一、ajax-hook插件

原理图

image


阅读全文 »

浏览器缓存机制

发表于 2018-06-28

一、缓存类型

  1、缓存类型分为强缓存和协商缓存

  • 强缓存:在用户请求资源时,如果命中强缓存,则不向服务器请求,而直接从本地获取资源。我们可以看到200状态码,并提示from disk cache或from memory cache。
  • 协商缓存: 在用户请求资源时,浏览器直接则向服务器发送请求,服务器根据 request header 来判断是否命中协商缓存,如果命中,则返回304和新的response header,使用本地资源;否则,返回新的资源。


2、区别

  • 共同点:两者命中后都是从本地读取资源。
  • 不同点: 强缓存很强势,是没有向服务器发出请求的; 而协商缓存必须要向服务器发一个请求来协商。
阅读全文 »

nginx-limit限速

发表于 2018-06-27

一、limit_conn

语法

1
2
3
4
Syntax:	limit_conn zone number;
Context: http, server, location
# zone 特定键值
# number 最大允许连接数

设置特定键值的共享内存区域和最大允许连接数。超过此限制时,服务器将返回错误以回复请求。

配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
http {
limit_conn_zone $binary_remote_addr zone=perip:10m;
limit_conn_zone $server_name zone=perserver:10m;
limit_conn_zone $server_name zone=peradd:10m;

...

server {
limit_conn perip 10;
limit_conn perserver 100;

...

location /download/ {
limit_conn peradd 1;
}

# perip 、perserver 和 peradd 是自定义的特定键值
# 分别标志着某个共享内存区域


阅读全文 »

直方图拉伸和图像均衡化

发表于 2018-06-24

img

img

阅读全文 »

图像处理之亮度与对比度

发表于 2018-06-24

这个公式可以解释对图像的亮度和对比度操作的原理

  • α能使图像像素成倍数的增长或降低(α<1),使图像的差值有线性变化,从而改变了图像的对比度。
  • β可为负,也可为正。任何一个像素加上或减去一个值会使这个像素点向白色或向黑色靠近,从而改变了图像的亮度。
阅读全文 »
1…131415…27

chenoge

一个程序猿和一支笔的故事

267 日志
438 标签
© 2020 chenoge
由 Hexo 强力驱动
|
主题 — NexT.Muse v5.1.4