※ [本文转录自 soho 看板 #1C2e-nde ] 作者: TonyQ (沉默是金。) 看板: soho 标题: Re: [情报] 诚徵网站开发soho人才 时间: Sun Jun 6 01:55:58 2010 ※ 引述《kuohuilu (风之影)》之铭言： : 推 JeremyJoung:老实说 每次看到有人提起jQuery就会一整个吐血 这种 06/01 23:48 : → JeremyJoung:执行效能低落到吐血的物件包 怎麽有办法这麽火红实在 06/01 23:49 : → JeremyJoung:令人匪夷所思 又不是说没jQuery就做不出来 06/01 23:49 : → gpmm:jQ 效能不好？？ hm.....可能见仁见智吧 :Q 06/02 00:17 : 推 JeremyJoung:jQ是方便(虽然我不觉得) 但是到一定程度以上系统後 06/02 00:24 : → JeremyJoung:会异常拖累效能 你可以想像 一个操作要10秒钟会怎样 06/02 00:25 : → JeremyJoung:一个按键就要10秒 没有唬人 06/02 00:25 : → lickpurple:可以举例怎麽个拖累法吗 ? 我是觉得还挺方便的 06/02 01:48 : → lickpurple:但是还没有碰上遇到效能上的问题，用JQ的AJAX 06/02 01:49 : → lickpurple:效能似乎也比内建的Call back来的高 06/02 01:50 : 推 JeremyJoung:基本上 就是 你页面载入瞬间 CPU满载锁死3-5秒 就这样 06/02 01:56 : 推 JeremyJoung:目前我大致上是可以推断是JQUERY的类innerHTML 06/02 02:08 : → JeremyJoung:但是更进一步的 还不确定 06/02 02:09 虽然说在soho版讨论技术话题有点跳tone，（欢迎来ajax版） 我想我们可以针对技术话题来讨论一下。 首先效能这个问题是by browser的，就跟灵异现象一样。 特别是webkit(safari), firefox,ie6,ie7,ie8 还有v8(chrome) 不同 js engine 表现其实会差蛮多的，ie6是其中最糟糕的， 所以应该要先讲明browser，这是一个很重要的讨论前提。 还有基本上用 jquery的前提下，大部分状况下不会比纯js coding好， 除了你纯js coding的技巧真的太差。 因为中间差了很多委派的隐性成本， 用lib本来就不是要追求效率上的快，而是开发速度上的快。 基本上你说的状况我有一些猜测， 你可以先试着用以下的方式去tune，如果你还有机会去做的话。 首先 js file的载入要尽可能的设计放在body尾端而非head， 放在head会造成页面因为读取js而有片段的卡住的情形。 再来要尽量避免在ready时 load 太多的片段，执行载入是需要成本的。 最後也最重要的是，尽可能减少 执行 selector 的动作。 错误示范 $(".message").html("hello"); $(".message").show(); $(".message").css("color","red"); 正确示范 var message=$(".message"); message.html("hello"); message.show(); message.css("color","red"); 在某些能力比较弱的browser ，这是很显着有影响的。 （对 ie6,我就是在说你！） : → gpmm:jQ 效能很吃使用手法（摊手） 06/02 02:42 : 推 JeremyJoung:其实我也没在使用JQ的 我是看别人的结果很凄惨 06/02 03:33 : → JeremyJoung:我习惯都是以ID操作 特效会做成FUNC封装 06/02 03:33 : → JeremyJoung:基本上 我不晓得 JQ究竟有什麽特点比较好? 06/02 03:34 : → JeremyJoung:他只是做成很像CLASS的操作手法而已 感觉根本没差 06/02 03:35 我觉得这有个很重要的前提，你已经有现成的东西可以用，才会这麽觉得。 比方说早期我们在做 request 也是拿example来改， 但是如果没有example咧？没有已经做好的东西时呢？ 你要花上半天一天的时间去重新开发一个 draggble， 跟那些灵异现象还有你的逻辑打仗，or 牺牲一点效能用jQuery开发？？ 当然，如果说是换换颜色变变位置显示隐藏这种level的效果， 的确用jQuery是蛮蠢的。 : → lickpurple:为啥会在page load锁死，除非是在page load的时候载入 06/03 00:15 : → lickpurple:很多设定，我大都是在page load之後才在用JQ的 06/03 00:16 : → lickpurple:我比较好奇的是为什麽锁死的情况，是怎麽锁死的 ? 06/03 00:18 : 推 JeremyJoung:我没有完全解晰该网页 不过他是采用二段LOAD 06/03 00:35 : → JeremyJoung:一开始只LOAD皮 之後再AJAX呼叫DATA 然後 这个二次载 06/03 00:37 : → JeremyJoung:入 会严重咬死CPU 非常明显 而且感觉IO LAG也非常严重 06/03 00:37 猜对了，这里有两个可能性要嘛就是他load进来的资料非常肥， 要嘛就是他load进来的东西分成非常多批。 这解法很简单，用jQuery.queue 依序给进去就好。 另外，要鼓励尽量避免太大量的 init ajax request ，有害无益。 还有，这问题就算用纯js写一样很难避免， 这是浏览器承受不住这麽多的资料同时处理的问题。 : → j100002ben:会不会是JS写得不好？还是网站资料太多? 06/03 11:28 : → arrack:jQ吃死效能那是看你怎麽写的.... 06/03 11:59 : → arrack:写得不好，就算自己用JS慢慢刻，效能一样惨 06/03 11:59 : → darkness001:应该是js写太烂吧... 06/03 20:22 有时候是网站本身的资料来源的设计就有问题， 不过大部分状况下都有方法可以再tune一些。 tune不起来的就只能改结构了，其实很多事情都有其先天上的限制的。 不过这类问题通常啦，纯js也很难解... : 推 aceone:jQ会红是因为它对美术人员来说很容易上手 我不懂js也用很凶 06/03 20:36 : → aceone:然後就变很慢 XD 不过程式都还会再拿去整理一遍 06/03 20:37 : → j100002ben:JS不能一直对DOM操作，那样会等死.要var出区域变数 06/04 07:28 应该说js不能一直对dom做query，不对dom的元素赋值干嘛的， 那用js干嘛 写cookie吗？ XD : 推 JeremyJoung:我可以确定 对方一定是不太会写程式 奇怪的BUG也不少 06/04 09:08 : → JeremyJoung:反正 给我的刻板印象就是 jQ能避就避 06/04 09:09 如果你不用 jQuery 可以做到，然後解决方案问题又比较少， 我也会鼓励你不用 jQuery ，事实上我自己现在也不太常用。 不过有些时候或有些功能你自己写会有很多奇怪的bug的时候， 那就不如用 jQuery 先顶着了。 类似的 sample 大概就像 drag and drop , dialog , sortable 之类的常用功能，自己写会有点辛苦， 而且代码不一定好maintain，那就不如用jQuery ui。 （还有就是像tooltip这种比较众技巧的效果） 对了，使用jQuery 或 js 一定都要对一件事情谨记在心， 事件的绑定是很高成本的，物件的层级越高成本就越高。 所以 body/window的事件是最高成本，因为event会有bubble的效果， 绑在body 的event 常常有机会被bubble到， 就算只是绑上去什麽也不做，这无形中仍会造成很大的负担， 每个事件的内容执行要尽可能的快，事件的绑定层级要尽可能的低， that's all. -- 我：一半的日子让你说，我听你说你的所有______________________________________ ______________________________________一半的日子我想说，对你说过去的所有：我 _______________________________________________________ 在讨论中妥善扮演兼具聆听与分享的角色，是我们一生的课题。 _______________________________________________________ --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 111.70.76.107 -- 我：一半的日子让你说，我听你说你的所有______________________________________ ______________________________________一半的日子我想说，对你说过去的所有：我 _______________________________________________________ 在讨论中妥善扮演兼具聆听与分享的角色，是我们一生的课题。 _______________________________________________________ --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 114.136.183.62