HTML5已经火了一段时间了，相信作为web相关开发工程师，肯定或多或少的了解和尝试过一些HTML5的特性和编程。还记得以前我们介绍过的HTML5新标签。 作为未来前端开发技术的潮流和风向标，HTML5绝对不容忽视。

在今天这篇技术分享文章中，我们将介绍几个HTML5的重要特性，能够帮助你提高整个web应用的使用体验和开发效率，相信大家会感兴趣的！

特性一：正则表达式

相信大家都会非常喜欢这个特性，无须服务器端的检测，使用浏览器的本地功能就可以帮助你判断电子邮件的格式，URL，或者是电话格式，防止用户输入错误的信息，通过使用HTML5的pattern属性，我们可以很方便的整合这个功能，代码如下：

<input type="email" pattern="[^ @]*@[^ @]*" value="">

特性二：数据列表元素

在没有HTML5的日子里，我们会选择使用一些JS或者知名的jQuery UI来实现自动补齐的功能，而在HTML5中，我们可以直接使用datalist元素，如下：

<form action="/server" method="post">
    <input list="jslib" name="jslib" >
    <datalist id="jslib">
        <option value="jQuery">
        <option value="Dojo">
        <option value="Prototype">
        <option value="Augular">
    </datalist>
    <input type="submit" value="完成" />
</form>

特性三：下载属性

HTML5的下载属性可以允许开发者强制下载一个页面，而非加载那个页面，这样的话，你不需要实现服务器端的一些功能来达到同样的效果，是不是非常贴心？

<a href="download_pdf.php" download="somefile.pdf">下载PDF文件</a> 

特性四：DNS的预先加载处理

要知道DNS的的解析成本很高滴，往往导致了网站加载速度慢。现在浏览器针对这个问题开发了更智能的处理方式，它将域名缓存后，当用户点击其它页面地址后自动的获取。

如果你希望预先获取NDS，你可以控制你的浏览器来解析域名，例如：

<link rel="dns-prefetch" href="//www.gbtags.com">
<link rel="dns-prefetch" href="//www.gbin1.com">
<link rel="dns-prefetch" href="//m.gbin1.com">
<link rel="dns-prefetch" href="//s.gbin1.com">

特性五：链接网页的预先加载处理

要知道链接能够在也页面中帮助用户导航，但是页面加载的速度快慢决定了用户体验的好与坏，使用如下HTML5的prefetch属性可以帮助你针对指定的地址预加载页面或者页面中的特定资源，这样用户点击的时候，会发现页面加载速度提高了。

<link rel="prefetch" href="http://www.gbtags.com/gb/users.htm" />
<link rel="prefetch" href="http://www.gbtags.com/gb/networks/themes/img/logo_small.jpg" />

或者可以使用prerender属性，这个属性能够帮助你提前加载整个页面，如下：

<link rel="prerender" href="http://www.gbtags.com/gb/search.htm" />

通过设置这个属性，登录极客社区后，极客搜索页面已经加载了，这样如果你需要搜索，页面会立刻加载，相信你的用户肯定喜欢访问这样的网站！

以上就是我们今天分享的五个实用的HTML5特性，希望大家喜欢。

转自：极客社区

为什么要使用ngrok？

作为一个Web开发者，我们有时候会需要临时地将一个本地的Web网站部署到外网，以供它人体验评价或协助调试等等，通常我们会这么做：

1. 找到一台运行于外网的Web服务器
2. 服务器上有网站所需要的环境，否则自行搭建
3. 将网站部署到服务器上
4. 调试结束后，再将网站从服务器上删除

只不过是想向朋友展示一下网站而已，要不要这么麻烦，累感不爱╰（｀□′）╯

有了ngrok之后，世界是如此的美好

1. 首先注册并下载ngrok，得到一串授权码
2. 运行命令ngrok -authtoken 你的授权码 80，80是你本地Web服务的端口，而之后ngrok会记住你的授权码，直接ngrok 80就OK了
3. 你会得到一串网址，通过这个网址就可以访问你本地的Web服务了

获取ngrok

ngrok官网

在过去做了不少代码走读，发现了一些代码质量上比较普遍的问题，以下是其中的前五名：

1. 臃肿的类：类之所以会臃肿，是因为开发者缺乏对最基本的编码原则，即“单一职责原则”（SRP）的理解。这些类往往会变得很臃肿，是由于不同的且在功能上缺少关联的方法都放在了相同的类里面。

2. 长方法：方法之所以会变得很长主要是有以下几个原因：

   1. 许多没有关联性的、功能复杂的模块的代码都放在相同的方法内。这主要是开发者缺乏SRP的概念。
   2. 多种条件都放在同一个方法内，这在长方法内经常会发生的。这是由于缺乏McCabe代码复杂度和SRP的概念的比较。
3. 大量的传参：我经常遇到这几种情况，一些方法跟另一些方法进行交互，或者调用另一些方法的时候传入大量的参数。这就会出现如果更改了其中一个参数，就得在多个方法内进行更改。
4. 常量值无处不在：经常会发现开发者（尤其是新手）会使用一些具有明确含义的常量值（主要是魔鬼数字），但没有给它们赋予合适的常量变量。这会降低代码的可读性和可理解性。

5. 模糊的方法名：许多时候，以下取的方法名会影响代码的可读性和可理解性：

   1. 模糊的不具有任何意义的方法名
   2. 技术性的，却没有提及相关领域的名称

(阅读全文…)

大学一毕业即成中年人，中国人的青春很短

赵薇的《致青春》是一部写实的片子。中国大陆的大多数80后90后，说起青春来，也就大学那几年的青春正宗一点。大学之前，十二年教育只为了一个目的：高考。必须心无旁骛，不能谈恋爱，明明看到喜欢的男生女生心里小鹿乱撞，也要硬生生地把情愫压下去，转移到厚厚的高考真题卷子里；老师整齐划一地说“青涩的果子是不能吃的”，多年来连修辞也不改一下。

大学过后，不，准确的说应该是从大四那年开始，残酷的就业压力如山雨欲来风满楼，大家再也无心在宿舍里煮个方便面，谈个无目的的恋爱，在草地上拨拉点吉他，读点柏拉图哲学了。我们的国情是，房子很快就成为后大学时代的主题。微博上流传的一段话并不假：“中国的高房价毁灭了年轻人的爱情，也毁灭了年轻人的想象力。他们本可以吟诵诗歌，结伴旅行，开读书会。现在，年轻人大学一毕业就成为中年人，为了房子精打细算。他们的生活，从一开始就是物质的，世故的，而不能体验一段浪漫的人生，一种面向心灵的生活方式。”

(阅读全文…)

jQuery Sina Emotion

重要说明：已更新，请通过 GitHub 获取最新版本。

这是什么？

一个用来方便快速地创建新浪微博表情选择对话框的jQuery插件。

有何特点

• 使用简单，一行代码即可创创建出表情选择对话框
• 自带智能表情解析方法（但还是建议表情解析在服务端进行）
• 兼容IE6+、Chrome、Firefox、Opera等各种浏览器

(阅读全文…)