HTTP协议

1.HTTP协议的主要特点

简单快速

每个资源URI(统一资源符)是固定的，比如图片、页面地址，所以HTTP协议中处理比较简单，访问某个资源输入URI即可

灵活

每个http协议中。有一个头部分，有个数据类型，通过一个http协议的就可以完成不同数据类型的传输

无连接 (重点)

连接一次就会断开，不会保持连接

无状态 (重点)

more >>

展开全文 >>

浮动解决方案

浮动元素引起的问题：

  1. 父元素的一级子元素全都为浮动元素的情况下，父元素的高度无法被撑开，影响与父元素同级的元素
  2. 与浮动元素同级的非浮动元素（内容）会跟随其后
  3. 若非第一个元素浮动，则该元素之前的元素也需要浮动，否则会影响页面显示的结构
more >>

展开全文 >>

viewport

前言

这次想聊聊移动开发相关的事。是的，你没有看错，一句话就可以开始你的移动前端开发。

你心里一定在想，什么话这么酷，能够瞬间带入到移动前端开发的世界。

但其实它一点也不新奇，不复杂。

more >>

展开全文 >>

HTTP状态码301和302区别

301和302都是重定向，他们之间有什么区别呢？

来看官方的解释，

301 Permanently Moved
被请求的资源已永久移动到新位置，并且将来任何对此资源的引用都应该使用本响应返回的若干个URI之一。如果可能，拥有链接编辑功能的客户端应当自动把请求的地址修改为从服务器反馈回来的地址。除非额外指定，否则这个响应也是可缓存的。

302 Temporarily Moved
请求的资源现在临时从不同的URI响应请求。由于这样的重定向是临时的，客户端应当继续向原有地址发送以后的请求。只有在Cache-Control或Expires中进行了指定的情况下，这个响应才是可缓存的。

more >>

展开全文 >>

js遍历

JavaScript 数组遍历方法的对比

原文首发至 lozoe.github.io 转载请标注原作者和附带原文连接

前言

JavaScript 发展至今已经发展出多种数组的循环遍历的方法,不同的遍历方法运行起来那个比较快,不同循环方法使用在那些场景,下面将进行比较:

more >>

展开全文 >>

Generator两个简单运用

偶尔在论坛中发现了两个非常优秀的代码实践，特此学习。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
{
  let draw = function count(count) {
    //抽奖逻辑 TODO
    console.log(`剩余${count}次机会`)
  }
  let residue = function* (count) {
    while(count > 0) {
      count--;
      yield draw(count);
    }
  }
  let star = residue(5); // 抽奖机会数从后端返回
  let drawHandler = function() {
      star.next();
  }; // 添加到点击抽奖按钮的逻辑
  /*
  let btn = document.createElement('button');
  btn.id = 'start';
  btn.textContent = '抽奖';
  document.body.appendChild(btn);
  document.getElementById('start').addEventListener('click', drawHandler, false);
  */
}
more >>

展开全文 >>

页面性能

提升页面的常用方法

  • 资源压缩合并，减少http请求，开启gzip压缩
  • 非核心代码异步加载
  • 利用浏览器缓存
  • 使用CDN
  • 预解析DNS
  • 域名收敛
  • 页面首屏优化(白屏优化、FMP、TTI)
  • 组件优化(懒加载、预加载、Keep-alive)
1
2
3
4
<!-- off为关闭,ON为开启,页面中所有的a标签默认开启dns预解析，但是如果页面是https的，浏览器默认关闭预解析，这里最好开启一下 -->
<meta http-equiv="X-dns-prefetch-control" content="on" />
<!--如果不确定是http还是https连接的话建议如下写法 -->
<link rel="dns-prefetch" href="//prefetchhostname.com" />
more >>

展开全文 >>

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

Lozoe，<br>毕业于大连皇家民族学院，目前就职于驼厂<br><br>热爱大海与冷笑话，<br/>目前是一枚前端<br/><br/>爱生活，爱健身，爱编码<br>年轻无为，卖马为生。