Archive for the ‘技术’ Category

Java抓取网页中的内容


今天工作中需要抓取网页中的内容,弄了两个小时搞定了,记录如下。

需求就是抓取实时的汇率

运行结果如下:

代码地址:http://code.google.com/p/catchwebhtmlcontent/downloads/list

Advertisements

window 上搭建nodejs环境


终于在window上算是把nodejs环境搭建好了,搭建的过程学了不少东西,了解了不少东西,记录下来,给自己,也分享给刚接触nodejs的朋友。

至于为什么要弄nodejs,网上的相关介绍不少,很有前途,我特别喜欢JavaScript,所以对nodejs很看好,看好的它的未来。

学习当然从官网开始:http://nodejs.org,下载最新版的nodejs。

接着进入它的代码库:https://github.com/joyent/node/wiki/Installation

上面有介绍怎样安装的nodejs。因为平常开发用的基本都是window系统,所以就想在window上来搭建。按照上面的文章来做,下载了cygwin,这个工具很好的,相见很晚啊,网上介绍这个工具的文章很多。接着进入https://github.com/joyent/node/wiki/Building-node.js-on-Cygwin-(Windows),介绍了怎样借助cygwin在window上搭建nodejs,介绍的很详细。下面来说我安装时的问题出在哪了,”setup.exe”是一个cygwin的引导文件,它会引导你下载所需的包,同时在网上我看了一篇文章关于安装cygwin的,说全选就是,我就就照做,悲剧的,周日那天我从上午11点搞到下午2点,还没有下载完,不是网速慢(也是个原因),是下载的包太多了。弄得我很纠结啊,是放弃那是go on?这时我也没有找到解决办法。

那就在网上找关于window下安装nodejs的资料,然后就发现了这里:http://www.grati.org/?page_id=213,说是这是编译好的文件,悲剧的是到现在我也没有弄明白这个怎么用啊,真是菜啊。下面有好多的评论,说了好多,还是对我没有实际的帮助啊(我当时的想法是我要是能把这环境搭建好,我一定弄给图文教程,好让入门者少走冤枉路啊)。

难道我在window下酒搭建不上了?那就在linux上搭建吧,这里有一篇文章http://www.cnblogs.com/wewe/archive/2010/03/19/1685658.html,next and next,结果到”./configure“这一步报错,说没有安装什么C++…等等,晕,我就无语了。原因是缺少包呗(囧,好久没有鼓捣linux,都忘了。看来这的补习一下了)。

感觉把这没有弄个出来,真是憋屈的,今天上午,边干活边想,又把https://github.com/joyent/node/wiki/Building-node.js-on-Cygwin-(Windows)篇文章看了一遍,“install the following packages required to compile node.js”,这段话提示了我,所以我在重新装cygwin,到了选择安装包的时候,我就搜索“必须的”,然后next,等待着见证奇迹,这回很快,不到3分钟就搞定,

然后按照剩下来的步骤,很顺利,然后按照官方谢了一个但helloWorld,ok,奇迹产生了,helloworld出来了,哈哈,小样,当时的心情怎一个美子了得啊。

小结一下,搭建nodejs有如下收获:

知道了cygwin这个软件,很强悍。知道了make,git,jquery的代码版本管理用的就是git。同时也知道了下一个目标就是在nodejs的基础上搭建uglify的,新版的jquery就是采用它来压缩的,压缩比很高。这个后面我将详说我是怎么做的。

路过的朋友发现有问题的,不清楚地方,欢迎拍砖。志同道合者,希望与之交流。

高效的JavaScript


原文章的地址是:http://www.woiweb.net/efficient-javascript.html

文章分析的不错,现在我把它简化一下,顺便理一理思路。

ECMAScript

1. 避免使用 eval 或 Function 构造函数

eval 函数效率特别低,由于事先无法知晓传给 eval 的字符串中的内容,eval在其上下文中解释要处理的代码,也就是说编译器无法优化上下文,因此只能有浏览器在运行时解释代码。这对性能影响很大。function比eval差不了多少,就是不会影响周围的代码。

2. 避免使用 with

在用with结构时,会创建一个新的作用域,但编译器不知道此作用的内容,无法像其他的作用域一样去优化。解决办法创建一个临时的变量。呵呵,这个with我是没有用过的。其实就是为了缩短查找范围。

3. 不要在影响性能的关键函数中使用 try-catch-finally

try-catch-finally 结构比较特殊。和其他语法结构不同,它在 runtime 的当前作用域中创建新变量。每当 catch 执行时,就会将捕获到的 exception 对象赋给一个变量。这个变量不属于任何脚本。它在 catch 语句开始时被创建,在结束时被销毁。

如果可能,应在脚本中不频繁被调用的地方进行异常处理,或通过检查某种动作是否被支持来避免使用。
4. 分隔 eval 和 with

如果可能,尽量将这些结构和其他代码分隔开,这样他们就不会影响脚本性能。如将其放在顶级函数中,或只执行一次然后保存运行结果,避免再次使用。
5. 避免使用全局变量

  • 影响元素查询,毕竟本地的近,所以快
  • 全局变量将始终存在在脚本生命周期中。而本地变量在本地作用域结束后就将被销毁,其所使用的内存也会被垃圾收集器回收。
  • 容易冲突

6. 注意隐式对象转换

这篇文章句的例子不错,淘宝UDE上也有说这个(具体的地址到不到了,下次碰见了,在不上),其实是说装箱和拆箱,当高访问量的,应该避免自动的装箱和拆箱,这样性能的差距会很大的

7. 在关键函数中避免 for-in

这暂时没有碰到,以后注意一下。
8. 优化 string 合并

文章的作者所说的和我的测试结果不一致,测试代码如下:

console.time(“aa”);
test1();//151ms
console.timeEnd(“aa”);
function test1(){
var a = “”;
for ( var i = 0; i < 1000000; i++) {
a += “x” + “y”;
}
}

console.time(“bb”);
test2();//272ms
console.timeEnd(“bb”);
function test2(){
var a = “”;
for ( var i = 0; i < 1000000; i++) {
a += “x”;
a += “y”;
}
}



9. 基本运算符比函数调用更快

这一条暂不支持,也不反对,待进一步研究后在说
10. 向 setTimeout() 和 setInterval()传送函数名,而不要传送字符串

如果传进参数是字符串,则在一段时间之后,会和 eval一样执行字符串值,当然其低效率也和 eval 一样。

 

DOM

通常主要有三种情况引起 DOM 运行速度变慢。

  • 第一就是执行大量 DOM 操作的脚本,如从获取的数据中建造新的 DOM 树。
  • 第二种情况是脚本引起太多的 reflow 或重绘。
  • 第三种情况是使用较慢的 DOM 节点定位方法。

1. 重绘和 reflow
1. 减少 reflow 次数
2. 最小化 reflow 影响
2. 修改 DOM 树
3. 修改不可见元素
4. 测量大小
5. 一次修改多个样式值
6. 用流畅性换取速度
7. 避免搜索大量节点
8. 使用 XPath 提高速度

看来的看看sizzle.js的源代码的,DOM查询时怎么做的啊。
9. 避免在遍历 DOM 时修改 DOM
10. 使用变量保存 DOM 值

页面载入

1. 避免保存来自其他文档的引用
2. 快速历史浏览
3. 使用 XMLHttpRequest
4. 动态创建 SCRIPT 元素
5. location.replace() 控制历史项

2010年我的技术存档整理


以前上班的时候,碰见好的东西,不知道往哪里存,反正就是觉得以后用的找,所有到处乱存,而且是存了后很少去看,应为不知在哪啊。用我一师兄的话就不会知识管理。

看了他一篇关于知识管理的文章很有想法。今天先吧把我以前qq微博(http://t.qq.com/kongxiantao)上的一些整理一下,基本上全是关于JavaScript的。

1.关于淘宝kissy的,这里有不少的内容

官方的doc地址:http://docs.kissyui.com/kissy/docs/

  • kissy的github地址:https://github.com/kissyteam
  • kissyTeam的github地址:https://github.com/kissyteam
  • kissy开发规范地址:http://docs.kissyui.com/docs/html/styleguide/
  • kissy组件开发流程地址:http://docs.kissyui.com/docs/html/workflow/
  • kissy-tools:https://github.com/kissyteam/kissy-tools#readme
  • kissy的官方blog:http://kissyui.com/blog/
  • kissy讲解:http://www.36ria.com/site-search?q=kissy&ie=UTF-8

这些可都是好东西啊,继续精读,研读。

kissy作者的blog地址:http://lifesinger.wordpress.com/,是个牛人啊,他的每一篇blog都是精品,而且blog更新很快,在这里学了不少的东西啊

2.YSlow使用指南

http://www.yslow.net/show.php?tid=123,很好的工具,呵呵,现在一直在用

3.关于前端JS、css压缩

这两个网站压缩后的JS和CSS比JSMIn,YUI compressor压缩后等都小不少那。不过要是压缩的很多js、css,而且还有文件夹嵌套,这两个的网站就有点不好用了,

我们公司是专门写了一个程序去请求它来做的。不过,我个人的观点是:应该采用YUI compressor,理由是:

  • 是有YUI推出的,大的团对都在用这个(如淘宝),质量上有保障
  • 而这两个网站所采用的压缩,我估计也是在类似于yui compressor这样的基础上优化的,这个有机会在深入研究一下,至于有多少团队在用,再是不清楚。
  • 不管用这几个那个工具压缩后,再用GZIP在做压缩,相差很少。
  • 其它的压缩,没有深入的研究过,像JSMin,没有发言权

4.IE调试

可能是firebug使用习惯了,在IE调试其他的工具也没有折腾过,不过发现也有IE想的firebug,不过没有ff中的好用,但基本能解决问题,只需要在代码中拷贝如下代码,

IE中的Firebug酒出来了

<script type=”text/javascript” src=”http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js”></script&gt;

5.JET

官网地址:http://code.google.com/p/j-et/(在这上面折腾过一阵,这个源码容易理解,又有中文注释,有机会的在读一遍)

6.JavaScript的相关网站论坛

7.不错的文章

    • 9个优秀的基于 JavaScript 与 CSS 的 Web 图表框架:http://www.cnblogs.com/wqj0405/archive/2010/10/19/1855575.html
    • 用jquery做的桌面:http://desktop.sonspring.com/
    • 很酷的一个网站,很强悍的网站啊,检测JS 框架冲突:http://mankz.com/code/GlobalCheck.htm
    • 前端常用的调试工具:http://www.slideshare.net/taobaoued/ss-3583978
    • 雅虎的34条军规-网站优化:http://www.slideshare.net/leneli/after-yahoo-34-rules-5088505
    • Xvfb+YSlow+ShowSlow搭建前端性能测试框架:http://ued.taobao.com/blog/2010/07/07/xvfb_yslow_showslow-2/(一直说试一试,知道现在也没有做)
    • JET介绍:http://kinvix.kdv.cn/blog/?p=53
    • 22个FF插件:http://hi.baidu.com/freezesoul/blog/item/dc7dea24b453fd0b4d088d46.html
    • 2010网页设计趋势:http://blog.sina.com.cn/s/blog_449c8d500100ngj0.html
    • 50个DEMO展示html5的魅力:http://www.cnblogs.com/zhuqil/archive/2010/10/26/1861773.html
    • 26个不错的jquery幻灯片插件:http://kedou.net/blog/4565.html
    • 30个web网站设计:http://designlol.net/archives/2418
    • Firefox插件中黑客工具级的Web开发工具:http://kinvix.kdv.cn/blog/?cat=11
    • 使用Fiddler提高前端工作效率:http://www.aliued.cn/?p=2581
    • 简历中的交互设计:http://fed.renren.com/2009/10/83#more-83
    • 开心网(kaixin.com)网站前端技术分析:http://www.yixiaoer.com/?p=1066
    • 解决IE6、IE7、IE8、Firefox兼容的几种方案:http://www.yixiaoer.com/?p=1048
    • 微软等公司数据结构+算法面试100题:http://blog.csdn.net/v_JULY_v/archive/2010/11/17/6015165.aspx
    • JS Test Driver :http://code.google.com/p/js-test-driver/
    • 前端优化方向:http://www.slideshare.net/nzakas/high-performance-javascript-webdirections-usa-2010
    • 前端要给力之:代码可以有多烂:http://blog.csdn.net/aimingoo/archive/2010/11/26/6036574.aspx
    • jquery 1.4.3源码解析:http://www.javaeye.com/topic/783260
    • prototype中文API:http://www.phpfans.net/manu/Prototype/
    • 75个最佳web设计资源:http://article.yeeyan.org/view/57288/22841?from_com
    • 面向程序员的数据库访问性能优化法则:http://blog.csdn.net/yzsind/archive/2010/12/06/6059209.aspx
    • wijmo—强大的jquery UI组件包:http://wijmo.com/demos/
    • 菜单360度旋转:http://cmc3.cn/n/2010/11/24/232.html
    • 如何成为一名专家级的开发人员:http://www.jobbole.com/entry.php/337
    • web开发者应该知道的最佳31个JavaScript工具:http://developer.51cto.com/art/201012/236740.htm
    • 应用最广的十大JavaScript框架:http://developer.51cto.com/art/200902/111044.htm
    • JavaScript压缩原理:http://www.slideshare.net/nzakas/extreme-javascript-compression-with-yui-compressor
    • IE内存泄露问题:http://yiminghe.javaeye.com/blog/422434
    • 攻城利器之微型框架 – Do:http://site.douban.com/widget/notes/22456/note/87598595/
    • 如何做好一份前端工程师的简历:http://ued.koubei.com/?p=873
    • 学习JavaScript不得不读的把本书:http://book.douban.com/doulist/55637/
    • html5在线测试:http://html5test.com/
    • 前端JavaScript代码组织:http://mzhou.me/?p=95230
    • JavaScript框架比较:http://hikejun.com/blog/?p=485,
    • dojo 编程规范:http://blog.bingo929.com/dojo-javascript-style-guide.html#more-3082
    • html5和css3资源汇总:http://blog.bingo929.com/html5-and-css3-tools-list.html