無標題文檔

关注第二届 D2 论坛

淘宝开了个好头 ,D2 前端开发论坛应誉而生。第二届的 D2 论坛在北京由中国 YAHOO 团队举行( 官方地址 )。

D2(Designer and Developer)前端技术论坛(简称D2),为国内前端开
发者和网站设计师提供一个交流的机会,一起分享技术的乐趣,探讨行
业的发展,以技术会友。今年D2来到北京,由中国雅虎主办,我们将努
力营造一种轻松自由的交流氛围,继续传承D2的宗旨,没有任何商业色
彩,不收取门票等任何费用,以纯粹的技术交流为根本,共同推动国内
前端技术的发展。

https://friable.rocks/_/2009_11_05/3378954f1f66.jpg

个人认为 D2 论坛还是有必要去见识下的。能和那些优秀团队的开发人员相互交流,这本身就是宗难得财富。

在北京有兴趣和时间的朋友,可以关注下此事。

创建高性能的 Web 页面

首先,感谢 圆心 和 小马 主持这次的技术交流会。此次关注的是 客户端的效率问题 ,根据 Yahoo 的总结,可以总结下面 14 条「军规」。

  1. 尽可能的减少 HTTP 的请求数 [content]
  2. 使用 CDN(Content Delivery Network) [server]
  3. 添加 Expires 头(或者 Cache-control) [server]
  4. Gzip 组件 [server]
  5. 将 CSS 样式放在页面的上方 [css]
  6. 将脚本移动到底部(包括内联的)[javascript]
  7. 避免使用 CSS 中的 Expressions [css]
  8. 将 JavaScript 和 CSS 独立成外部文件 [javascript] [css]
  9. 减少 DNS 查询 [content]
  10. 压缩 JavaScript 和 CSS (包括内联的)[javascript] [css]
  11. 避免重定向 [server]
  12. 移除重复的脚本 [javascript]
  13. 配置实体标签(ETags)[css]
  14. 使 Ajax 缓存 [content]

根据,PPT 的内容所示,我使用 Yslow 检查了下本人的主页,才得了个「F 47」(坦白说,与我本人估计的非常有出入)。

https://friable.rocks/_/2009_11_05/1971454c2cf7.jpg

主要的问题就是没有开启 Gzip 压缩,以及没有设置 HTTP 头缓存。看来折腾了那么久,除了服务器端的性能,客户端的缓存还是不能忽视的。

想想看,如果淘宝首页没有缓存,即便是多了 1KB 的页面容量,乘以每天上亿的 PV,这个数字将是多么的庞大。

最后, 提供本次的交流会的 PPT 下载 ,再次感谢他们。

有关更多的信息,可以访问 圆心 同志的 Blog ,他上面有更详实的内容。

别忘记清除浮动

很早的时候, 圆心 就告诫我,「要随时清楚浮动元素」。当时由于忙(也许这算不上是借口),我把他的话当作了耳边风。

今天偏偏在工作最为忙乱的时候,运营那边在添加数据时,发现页面乱了。幸好又是伟大的 圆心 同志帮我找到了这个老问题,并解决(大哥在上,请接受小弟一拜)。

总结下清除浮动的一般解决方案,更多的总结可以 看这里

用空标签清除

.clr {clear: both;}

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>
    <p class="clr"></p>
</div>

使用 overflow 属性

#layout {overflow:auto; zoom:1;}

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>
</div>

使用 :after (非 IE 浏览器)

#layout:after{
    display: block;
    clear: both; content: "";
    visibility:hidden; height: 0;
}

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>
</div>

注:使用 :after 需要注意几点,设置高度为零(height: 0;);content 是必须的,但其值可以为空。

我的照片

嗨!我叫「明城」,八零后、码农、宁波佬,现居杭州。除了这里,同时也欢迎您关注我的 GitHubTwitterInstagram 等。

这个 Blog 原先的名字叫 Gracecode.com 、现在叫 「無標題文檔」 。 要知道作为码农取名是件很难的事情,所以不想在取名这事情上太费心思。

作为八零后,自认为还仅存点点可能不怎么被理解的幽默感,以及对平淡生活的追求和向往。 为了避免不必要的麻烦,声明本站所输出的内容以及观点仅代表个人,不代表自己所服务公司或组织的任何立场。

如果您想联系我,可以发我邮件 `echo bWluZ2NoZW5nQG91dGxvb2suY29tCg== | base64 -d`

分类

搜索

文章