��谈如何提高AJAX客户端响应速度

风舞�׃ؕ — Mon, 23 May 2011 10:08:00 GMT

��谈如何提高AJAX客户端响应速度

http://developer.51cto.com 2009-06-24 15:16 包一��? JavaEye 我要评论(0)

AJAX 的出现极大的改变�?Web 应用客户端的操作模式�Q�它使的用户可以在全心工作时不必频繁的忍受那令�h厌恶的页面刷新。理��Z�� AJAX 技术在很大的程度上可以减少用户操作的等待时��_��同时节约�|�络上的数据��量。而然�Q�实际情况却�q�不��L��q�样。用��h��怼�抱怨用�?AJAX 的系�l�响应速度反而降低了。本文将谈谈如何提高响应速度�?/ul>

�W�者从事AJAX 斚w��的研发多�q�_��参与开发了目前国内较�ؓ成熟的AJAX�q�_�� -dorado 。根据笔者的�l�验�Q�导致这�U�结果的�Ҏ��原因�q�不在AJAX 。很多时候系�l�响应速度的降低都是由不够合理的界面设计和不够高效的编�E�习惯造成的。下面我们就来分析几�?AJAX 开发过�E�中需要时��L��意的环节�?/p>

n 合理的��用AJAX客户端编�E�和�q�程�q�程调用�?/p>

AJAX客户端的�~�程主要都是��Z�� JavaScript 的。�?JavaScript 是一�U�解释型的编�E�语�a��Q�它的运行效率相对于 Java �{�都要稍逊一�{�V��同�?JavaScript 又是�q�行在浏览器�q�样一个严格受限的环境当中。因此开发�h员对于哪些逻辑可以在客��L��执行应该有一个清醒的认识�?/p>

在实际的应用中究竟应该怎样使用客户端编�E�，�q�依赖于开发�h员的�l�验判断。这里很多问题是只可意会的。由于篇�q�有限，在这里我们大致归�U�_��下面�q�几个注意事��：

u ��可能避免频�J�的使用�q�程�q�程调用�Q�例如避免在循环体中使用�q�程�q�程调用�?/p>

u 如果可能的话��可能��?AJAX 方式的远�E�过�E�调用（异步方式的远�E�过�E�调用）�?/p>

u 避免��重量��的数据操作放�|�在客户端。例如：大批量的数据复制操作、需要通过大量的数据遍历完成的计算�{��?/p>

n 改进�?DOM 对象的操作方式�?/p>

客户端的�~�程中，�?DOM 对象的操作往往是最�Ҏ��占用 CPU 旉��的。而对�?DOM 对象的操作，不同的编�E�方法之间的性能差异又往往是非常大的�?/p>

以下是三�D�运行结果完全相同的代码�Q�它们的作用是在�|�页中创��Z��?10x1000 的表根{��然而它们的�q�行速度却有着天壤之别�?/p>

        
            /* ���试代码 1 - 耗时 : 41 �U?nbsp;*/   
            var table = document.createElement("TABLE");   
            document.body.appendChild(table);   
            for(var i = 0; i < 1000; i++){   
              var row = table.insertRow(-1);   
              for(var j = 0; j < 10; j++){   
                var cell = objRow.insertCell(-1);   
                  cell.innerText = "( " + i + " , " + j + " )";   
              }   
            }   
            /* ���试代码 2 - 耗时 : 7.6 �U?nbsp;*/   
            var table = document.getElementById("TABLE");   
            document.body.appendChild(table);   
            var tbody = document.createElement("TBODY");   
            table.appendChild(tbody);   
            for(var i = 0; i < 1000; i++){   
              var row = document.createElement("TR");   
              tbody.appendChild(row);   
              for(var j = 0; j < 10; j++){   
                var cell = document.createElement("TD");   
                  row.appendChild(cell);   
                  cell.innerText = "( " + i + " , " + j + " )";   
              }   
            }   
            /* ���试代码 3 - 耗时 : 1.26 �U?nbsp;*/   
            var tbody = document.createElement("TBODY");   
            for(var i = 0; i < 1000; i++){     
              var row = document.createElement("TR");   
                   for(var j = 0; j < 10; j++){   
                var cell = document.createElement("TD");   
                  cell.innerText = "( " + i + " , " + j + " )";   
                  row.appendChild(cell);   
              }   
              tbody.appendChild(row);   
            }   
            var table = document.getElementById("TABLE");   
            table.appendChild(tbody);   
            document.body.appendChild(table);

�q�里�?#8220;��试代码 1 ”�?#8220;��试代码 2 ”之间的差别在于在创徏表格单元时��用了不同�?API �Ҏ��。�?#8220;��试代码 2 ”�?#8220;��试代码 3 ” 之间的差别在于处理顺序的略微不同�?/p>

“��试代码 1 ”�?#8220;��试代码 2 ”之间如此大的性能差别我们无从分析�Q�目前所知的�?insertRow �?insertCell �?DHTML 中表格特有的 API �Q?createElement �?appendChild �?W3C DOM 的原�?API 。而前者应该是对后者的��装。不�q�，我们�q�不能因此而得出结��?DOM 的原�?API ��L��优于对象�Ҏ��?API 。徏议大家在需要频�J�调用某一 API �Ӟ��对其性能表现做一些基本的��试�?/p>

“��试代码 2 ”�?#8220;��试代码 3 ”之间的性能差异主要来自于他们的构徏��序不同�?#8220;��试代码 2 ”的做法是首先创徏最外层�?

。�?#8220;��试代码 3 ”的做法是首先在内存中由内到外的构建好整个表格�Q�最后再��它��d��到网��中。这样做的目的是��可能的减少��览器重新计��页面布局的次数。每当我们将一个对象添加到�|�页中时�Q�浏览器都会��试寚w��面中的控件的布局�q�行重新计算。所以，如果我们能够首先在内存中��整个要构造的对象全部创徏好，然后再一�ơ性的��d��到网��中。那么，��览器将只会做一�ơ布局的重计算。�ȝ��Z��句话那就是越晚执�?appendChild ��好。有时�ؓ了提高运行效率，我们甚至可以考虑先��?removeChild ��已存在的控件从��面中移除，然后构造完成后再重新将其放�|�回��面当中�?/p>

n 提高字符串篏加的速度

在��?AJAX 提交信息�Ӟ��我可能常帔R��要拼装一些比较大的字�W�串通过 XmlHttp 来完�?POST 提交。尽��提交这样大的信息的做法看�v来�ƈ不优雅，但有时我们可能不得不面对�q�样的需求。那�?JavaScript 中对字符串的累加速度如何呢？我们先来做下面的�q�个实验。篏加一个长度�ؓ 30000 的字�W�串�?/p>

        
            /* ���试代码 1 - 耗时 : 14.325 �U?nbsp;*/    
            var str = "";   
            for (var i = 0; i < 50000; i++) {   
                   str += "xxxxxx";   
            }

�q�段代码耗时 14.325 �U�，�l�果�q�不理想。现在我们将代码改�ؓ如下的�Ş式：

        
            /* ���试代码 2 - 耗时 : 0.359 �U?nbsp;*/    
            var str = "";   
            for (var i = 0; i < 100; i++) {   
                   var sub = "";   
                   for (var j = 0; j < 500; j++) {   
                          sub += "xxxxxx";   
                   }   
                   str += sub;   
            }

�q�段代码耗时 0.359 �U�！同样的结果，我们做的只是首先��D��一些较��的字符串然后再�l�装成更大的字符丌Ӏ�这�U�做法可以有效的在字�W�串��D��的后期减��内存复制的数据量。知道了�q�一原理之后我们�q�可以把上面的代码进一步拆散以后进行测试。下面的代码仅耗时 0.140 �U��?/p>

        
            /* ���试代码 3 - 耗时 : 0.140 �U?nbsp;*/   
            var str = "";    
            for (var i1 = 0; i1 < 5; i1++) {   
                   var str1 = "";   
                   for (var i2 = 0; i2 < 10; i2++) {   
                          var str2 = "";   
                          for (var i3 = 0; i3 < 10; i3++) {   
                                 var str3 = "";   
                                 for (var i4 = 0; i4 < 10; i4++) {   
                                        var str4 = "";   
                                        for (var i5 = 0; i5 < 10; i5++) {   
                                               str4 += "xxxxxx";   
                                        }   
                                        str3 += str4;   
                                 }   
                                 str2 += str3;   
                          }   
                          str1 += str2;   
                   }   
                   str += str1;     
            }

不过�Q�上面这�U�做法也许�ƈ不是最好的�Q�如果我们需要提交的信息�?XML 格式的（其实�l�大多数情况下，我们都可以设法将要提交的信息�l�装�?XML 格式�Q�，我们�q�能扑ֈ�更高效更优雅的方�?— 利用 DOM 对象为我们组装字�W�串。下面这�D�代买组装一个长度�ؓ 950015 的字�W�串仅须耗时 0.890 �U��?/p>

        
            /* 利用 DOM 对象�l�装信息 - 耗时 : 0.890 �U?nbsp;*/   
            var xmlDoc;     
            if (browserType == BROWSER_IE) {   
                   xmlDoc = new ActiveXObject("Msxml.DOMDocument");   
            }   
            else {   
                   xmlDoc = document.createElement("DOM");   
            }   
            var root = xmlDoc.createElement("root");   
            for (var i = 0; i < 50000; i++) {   
                   var node = xmlDoc.createElement("data");   
                   if (browserType == BROWSER_IE) {   
                          node.text = "xxxxxx";   
                   }   
                   else {   
                          node.innerText = "xxxxxx";   
                   }   
                   root.appendChild(node);   
            }   
            xmlDoc.appendChild(root);   
            var str;   
            if (browserType == BROWSER_IE) {   
                   str = xmlDoc.xml;   
            }   
            else {   
                   str = xmlDoc.innerHTML;   
            }   
            n

避免 DOM 对象的内存泄漏�?/p>

关于 IE �?DOM 对象的内存泄露是一个常常被开发�h员忽略的问题。然而它带来的后果却是非�怸�重的�Q�它会导�?IE 的内存占用量持箋上升�Q��ƈ且浏览器的整体运行速度明显下降。对于一些泄露比较严重的�|�页�Q�甚臛_��要刷新几�ơ，�q�行速度��׃��降低一倍�?/p>

比较常见的内存泄漏的模型�?#8220; 循环引用模型”�?#8220; 闭包函数模型”�?#8220; DOM 插入��序模型” , 对于前两�U�泄漏模型，我们都可以通过在网��|��构时解除引用的方式来避免。而对�?#8220; DOM 插入��序模型”则需要通过改变一些惯有的�~�程习惯的方式来避免�?/p>

有关内存泄漏的模型的更多介绍可以通过 Google 很快的查刎ͼ�本文不做�q�多的阐�q�。不�q�，�q�里我向您推荐一个可用于查找和分析网��内存泄露的��工�?— Drip �Q�目前的较新版本�?0.5 �Q�下载地址�?http://outofhanwell.com/ieleak/index.php

n 复杂��面的分�D�装载和初始�?/p>

对系�l�当中某些确实比较复杂而又不便使用 IFrame 的界面，我们可以对其实施分段装蝲。例如对于多��|��{��界面�Q�我们可以首先下载和初始化多��|��{��默认��，然后利用 AJAH �Q?asynchronous JavaScript and HTML �Q�技术来异步的装载其他标�{�N��中的内容。这样就能保证界面可以在�W�一旉��首先展现�l�用戗��把整个复杂界面的装载过�E�分散到用户的操作过�E�当中�?/p>

n 利用 GZIP 压羃�|�络��量�?/p>

除了上面提到的这些代码��的改良之外，我们�q�可以利�?GZIP 来有效的降低�|�络��量。目前常见的��L��览器已�l�全部支�?GZIP ��法�Q�我们往往只需要编写少量的代码��可以支�?GZIP 了。例如在 J2EE 中我们可以在 Filter 中通过下面的代码来判断客户端浏览器是否支持 GZIP ��法�Q�然后根据需要利�?java.util.zip.GZIPOutputStream 来实�?GZIP 的输出�?/p>

        
            /* 判断���览器对 GZIP 支持方式的代�?nbsp;*/   
            private static String getGZIPEncoding(HttpServletRequest request) {   
              String acceptEncoding = request.getHeader("Accept-Encoding");   
              if (acceptEncoding == null) return null;   
              acceptEncodingacceptEncoding = acceptEncoding.toLowerCase();   
              if (acceptEncoding.indexOf("x-gzip") >= 0) return "x-gzip";   
              if (acceptEncoding.indexOf("gzip") >= 0) return "gzip";   
              return null;   
            }

一般而言�Q?GZIP 对于 HTML �?JSP 的压�~�比可以辑ֈ� 80% 左右�Q�而它造成的服务端和客��L��的性能损耗几乎是可以忽略的。结合其他因素，支持 GZIP 的网站有可能为我们节�U?50% 的网�l�流量。因�?GZIP 的��用可以�ؓ那些�|�络环境不是特别好的应用带来显著的性能提升。��?Http 的监视工�?Fiddler 可以方便的检��出�|�页在��?GZIP 前后的通讯数据量�?Fiddler 的下载地址�?http://www.fiddlertool.com/fiddler/

关于 Web 应用的性能优化其实是一个非常大的话题。本文由于篇�q�有限，只能涉及其中的几个细节，�q�且也无法将�q�些�l�节的优化方式全面的展现�l�大家。期望本文能够引起大家对 Web 应用��其是客��L��性能优化的充分重视。毕竟服务端�~�程技巧已为大家熟知多�q�_��在服务端挖掘性能的潜力已�l�不大了。而在客户端的�Ҏ��改进往往能够得到令�h惊奇的性能提升�?/p>

【编辑推荐�?/p>

JSF和Spring的集�?/font>

JSF中��用自定义Navigation

��单介�l�JSF应用

JSF动态生成固定表头和行标的DataTable

JSF和JSP是一�Ҏ��的搭�?/font>

风舞�׃ؕ 2011-05-23 18:08 发表评论

风舞�׃ؕ — Mon, 23 May 2011 10:07:00 GMT

n 合理的��用AJAX客户端编�E�和�q�程�q�程调用�?/p>

u ��可能避免频�J�的使用�q�程�q�程调用�Q�例如避免在循环体中使用�q�程�q�程调用�?/p>

u 如果可能的话��可能��?AJAX 方式的远�E�过�E�调用（异步方式的远�E�过�E�调用）�?/p>

u 避免��重量��的数据操作放�|�在客户端。例如：大批量的数据复制操作、需要通过大量的数据遍历完成的计算�{��?/p>

n 改进�?DOM 对象的操作方式�?/p>

以下是三�D�运行结果完全相同的代码�Q�它们的作用是在�|�页中创��Z��?10x1000 的表根{��然而它们的�q�行速度却有着天壤之别�?/p>

        
            /* ���试代码 1 - 耗时 : 41 �U?nbsp;*/   
            var table = document.createElement("TABLE");   
            document.body.appendChild(table);   
            for(var i = 0; i < 1000; i++){   
              var row = table.insertRow(-1);   
              for(var j = 0; j < 10; j++){   
                var cell = objRow.insertCell(-1);   
                  cell.innerText = "( " + i + " , " + j + " )";   
              }   
            }   
            /* ���试代码 2 - 耗时 : 7.6 �U?nbsp;*/   
            var table = document.getElementById("TABLE");   
            document.body.appendChild(table);   
            var tbody = document.createElement("TBODY");   
            table.appendChild(tbody);   
            for(var i = 0; i < 1000; i++){   
              var row = document.createElement("TR");   
              tbody.appendChild(row);   
              for(var j = 0; j < 10; j++){   
                var cell = document.createElement("TD");   
                  row.appendChild(cell);   
                  cell.innerText = "( " + i + " , " + j + " )";   
              }   
            }   
            /* ���试代码 3 - 耗时 : 1.26 �U?nbsp;*/   
            var tbody = document.createElement("TBODY");   
            for(var i = 0; i < 1000; i++){     
              var row = document.createElement("TR");   
                   for(var j = 0; j < 10; j++){   
                var cell = document.createElement("TD");   
                  cell.innerText = "( " + i + " , " + j + " )";   
                  row.appendChild(cell);   
              }   
              tbody.appendChild(row);   
            }   
            var table = document.getElementById("TABLE");   
            table.appendChild(tbody);   
            document.body.appendChild(table);

“��试代码 2 ”�?#8220;��试代码 3 ”之间的性能差异主要来自于他们的构徏��序不同�?#8220;��试代码 2 ”的做法是首先创徏最外层�?

n 提高字符串篏加的速度

        
            /* ���试代码 1 - 耗时 : 14.325 �U?nbsp;*/    
            var str = "";   
            for (var i = 0; i < 50000; i++) {   
                   str += "xxxxxx";   
            }

�q�段代码耗时 14.325 �U�，�l�果�q�不理想。现在我们将代码改�ؓ如下的�Ş式：

        
            /* ���试代码 2 - 耗时 : 0.359 �U?nbsp;*/    
            var str = "";   
            for (var i = 0; i < 100; i++) {   
                   var sub = "";   
                   for (var j = 0; j < 500; j++) {   
                          sub += "xxxxxx";   
                   }   
                   str += sub;   
            }

        
            /* ���试代码 3 - 耗时 : 0.140 �U?nbsp;*/   
            var str = "";    
            for (var i1 = 0; i1 < 5; i1++) {   
                   var str1 = "";   
                   for (var i2 = 0; i2 < 10; i2++) {   
                          var str2 = "";   
                          for (var i3 = 0; i3 < 10; i3++) {   
                                 var str3 = "";   
                                 for (var i4 = 0; i4 < 10; i4++) {   
                                        var str4 = "";   
                                        for (var i5 = 0; i5 < 10; i5++) {   
                                               str4 += "xxxxxx";   
                                        }   
                                        str3 += str4;   
                                 }   
                                 str2 += str3;   
                          }   
                          str1 += str2;   
                   }   
                   str += str1;     
            }

        
            /* 利用 DOM 对象�l�装信息 - 耗时 : 0.890 �U?nbsp;*/   
            var xmlDoc;     
            if (browserType == BROWSER_IE) {   
                   xmlDoc = new ActiveXObject("Msxml.DOMDocument");   
            }   
            else {   
                   xmlDoc = document.createElement("DOM");   
            }   
            var root = xmlDoc.createElement("root");   
            for (var i = 0; i < 50000; i++) {   
                   var node = xmlDoc.createElement("data");   
                   if (browserType == BROWSER_IE) {   
                          node.text = "xxxxxx";   
                   }   
                   else {   
                          node.innerText = "xxxxxx";   
                   }   
                   root.appendChild(node);   
            }   
            xmlDoc.appendChild(root);   
            var str;   
            if (browserType == BROWSER_IE) {   
                   str = xmlDoc.xml;   
            }   
            else {   
                   str = xmlDoc.innerHTML;   
            }   
            n

避免 DOM 对象的内存泄漏�?/p>

n 复杂��面的分�D�装载和初始�?/p>

n 利用 GZIP 压羃�|�络��量�?/p>

        
            /* 判断���览器对 GZIP 支持方式的代�?nbsp;*/   
            private static String getGZIPEncoding(HttpServletRequest request) {   
              String acceptEncoding = request.getHeader("Accept-Encoding");   
              if (acceptEncoding == null) return null;   
              acceptEncodingacceptEncoding = acceptEncoding.toLowerCase();   
              if (acceptEncoding.indexOf("x-gzip") >= 0) return "x-gzip";   
              if (acceptEncoding.indexOf("gzip") >= 0) return "gzip";   
              return null;   
            }

风舞�׃ؕ 2011-05-23 18:07 发表评论

转脓] 谈不��h��q��80后，看来我们真的是老了吗？

风舞�׃ؕ — Sun, 25 Oct 2009 13:52:00 GMT

[
现在的我们已�l�到了谈婚论嫁的�q�龄�Q?br /> 但是�w�边好多同学和同事仍然是单��n�?br /> 当我问及他们的时候，回答都是�Q�婚��L��件大事不敢太草率了，
所以选自己另一半的时候更多的是理智�?br /> 然而，好多没谈�q�恋��q��是期望自��p��谈一场真正的恋爱�Q?br /> 然后和自己心��q��人携手走入婚�ȝ��D�堂�?br /> 但是谈恋爱对80�q�代的我们来说已�l�成��Z��U�奢侈，
有这�U�想法的人恐怕不只是我一个�h�Q�因为我们都谈不��h��׃��?br /> 不管谈过�q�是没谈�q�，都不敢把太多的感情放在恋�׃��Q?br /> 因�ؓ��x��失败，我们已经承受不�v�?

有同事去�怺��Q�有时不错，回来后就�l�常联系。但是她说找不到恋爱的感觉，更像是朋友，
他们不会付出太多的感情，也不会对你太好�?br /> 是啊�Q�可以理解，
因�ؓ男�h们也��x��，他们同样不敢��d��试，
��x��自己是剃头挑子一头热�?br /> 姐妹们谈起婚�ȝ��时候��L��在说�Q�找个对自己好的男�h��嫁了吧�Q?br /> 不管自己喜不喜欢�Q�结婚后也会对他好，
生个��Baby�t�踏实实�q�一辈子�?br /> ��h��朋友则是找个会�q�日子的女�h�Q?br /> 好好待她�Q�安安稳�E��日子��好了，
因�ؓ在外面打拼真的很累，��x��个温暖家�?br /> 才发现恋爱已�l�离我们�q�去�Q?br /> 剩下的只是婚姅R��生�z�R��日子�?

��x��我们的这�?0后的��Z��Q�爱情远��L��们，�l�婚又像是完成��命一��P��
�l�济条�g也不是那么重要，
找个男�h(女�h)�t�踏实实�q�日子才是我们的宗旨�?br /> 当妹妹告诉我她们宿舍的女孩如何如何谈恋爱�Q?br /> 如何如何换男朋友�Q�如何如何浪漫，
我只能感�?#8220;你们�q�有谈恋��q��资本和勇气�?#8221;
妹妹说你也不老啊�Q�别��L��自己想的那么老，赶快�l�我找个姐夫�?br /> 我们�q�不是承认自��p��，臛_��我这栯��为，但是爱情观和婚姻观还是大不一��L��?

当有朋友问�v我什么时候结婚？我说�q�男朋友�q�没有和谁结婚啊�Q?#8220;那找一个嘛�Q?#8221;
“又不是逛商场，说找个就找个�Q?#8221;“哎呀�Q�要求不要那么高啊！”
其实我也和姐妹们一��L��x��找个仅仅�Ҏ��好的��好了，
相貌、学历、经��都不重要，重要的是个�h能力�?br /> “三高政策”也只是我们茶余饭后开的玩�W�话�|�了�?br /> 姐妹们经常说�Q�当真正有一个疼我们、爱我们的�h摆在面前的时候，
我们一定好好珍惜�?br /> 是现在的好男人少了吗�Q?br /> 不是�Q�我不这栯��为，好男��是很多的�Q?br /> 只是我们没有发觉又或者是发觉了没有勇气去说服自己�?br /> 好多奛_��都是放不下自��q��持，总认为男孩应该主动�?br /> 因�ؓ我们不像90�q�代的�h们敢爱敢恨，
可以大胆说出自己的爱�Q�哪怕是被拒�l��?br /> 臛_��我��n边的好多朋友都是�q�样�Q�错�q�了好多好男人，
当自己心��q��男�h成�ؓ别�h的老公的时候，
而且是通过别�h介绍�l�婚的时候，
我们只能偷偷的抹一把泪�Q��ؓ他们��福�?br /> 又或者关几天自己��闭�Q�故事的�l�局往往是那么伤感�?br /> ��Z��么我们宁愿彼此都受伤�Q�也不愿意把心中的爱说出来呢�Q?br /> 因�ؓ我们��L��不确定对方心里是否有我们�?br /> 所以我们��L��在矛盾中把自��q��恋爱丢掉了，
不知不觉��来��C��l�婚的年龄�?br />
可是此时我们真的已经谈不��h��׃��Q?

喜欢隐��n了，
不怎么爱在��里发言�?
不论和多��h在一块，手机��L��着QQ�Q?br /> 一堆�h聚在一块，一��Z��台手机，各玩各的�?br /> 同学聚会必修的两个项目：吃饭�Q�KTV
��孩都开始叫自己叔叔或者阿姨了�Q?br /> 虽然�l�常不大情愿地反驳着�Q�叫姐姐�Q�叫哥哥
永远寂寞�Q�不��你是一人独处时�Q�还是��n在�h��当中，
��像那首歌中��q��一��P��孤单�Q�是一个�h的狂�Ƣ，狂欢�Q�是一��h的孤单�?br /> 没那么愤青了�Q�遇��C��公的时候，会告诉自己，�C�会��是�q�样�Q?br /> 可以不看电视�Q�但电脑是必需品，
出门�y�达必带三�g宝：手机�Q�钥匙，�?br /> 永远不知道钱花哪了，没怎么吃，没怎么�I?br /> 消极�Q�拒�l�长大�?br /> 不喜�Ƣ被��成熟�Q?br /> 熟�h面前是话唠，生�h面前一�a�不发�Q?br /> 爱好中必定有一��Ҏ��睡觉�Q?br /> 成天泡在�|�上�Q�又不知道做什么好�?br /> 最常说的一句话�?#8220;无聊”,
��管�Q�他们在�|�络上，花去了大把时间�?br /> 减肥是永恒不变的话题和行动，
饿了��吃�Q�经常早饭午饭�ƈ在一起吃�Q?br /> 打字的手法相当不准确�Q�但�q�是打的很快�?br /> 凌晨12点前很少会入睡，
什么都可以“随便”�Q�因为没那么多时��_��也不在意那么多的事情�?br /> 毫无理由没有资本的高�Ԍ��骨子里却自卑�Q�期待肯定，期待认可�Q�被讨厌做�h��p�|的时候连说话的勇气都没有�?br /> 觉得别�h不可能了解自己，�q�以此作为对别�h不屑的理由�?br /> 因�ؓ别�h都恋�׃��Q�所以自己就恋爱了，更多的是�l�爱而不是恋爱，然后�q�自己都开始怀疑曾�l�对爱情�?坚持�?br /> 曄��以�ؓ一辈子陪在�w�边的朋友，某天某月�Q�就�H�然发现他们都不见了�?br /> 午夜醒来�Q�才愕然发现�Q�从来都是只有自�׃��个�h�Q?br /> ��成长�Q�越�Ҏ��孤单�?br />
80后的我们�Q�有很多的梦惻I��有的实现了有的破灭了�?br /> 80后的我们�Q�有的出名，有的默默无闻�?br /> 80后的我们�Q�挣扎过彷��L�q�，�q�是��来了�?br /> 80后的我们�Q�退去青春年�q�的智嫩�Q�开始适应�C�会大家庭�?br /> 我们的心里都很清楚，我们�l�历了太多太多�?br /> 亲情的分与合�Q?br /> 爱情的分与合�Q?br /> 友情的分与合�Q?br /> 曾不��一切的�q�求�q�的�Q�后来变的一文不值得�?br /> 父母曄��般阻挠的事，直到自己受伤�Q�才明白�Q�父母原来是对的�?br /> 曾无数次的问�q�自己，��Z�� 么活着�Q?br /> 到后来，已经懒得的去��x��着的意义�?br /> 曾�ؓ了爱情可以不好好的读书，
到后来�ؓ了工作可以丢下爱情�?br /> 现在是否�q�记得最初的梦想�Q?br /> 或者说�Q?�q�有多少人，一直坚持着自己�q�少时的梦想�?br /> 在家里，父母�Ҏ��们百依百��，
��Z��安��Q�我们对�C�会百依��N��?br /> 看不惯的事情也就渐渐习惯了，不知道这�U�习惯是好是坏？
我甚至不知道我现在的梦想应该是什么？
但有一点的是肯定的�Q?br /> 不会再做一些年��轻狂的梦了......

风舞�׃ؕ 2009-10-25 21:52 发表评论

风舞�׃ؕ — Wed, 14 Oct 2009 02:11:00 GMT

public static void test2() {
  try {
   // ��d��W�一张图�?br />    // File fileOne = new File("D:\\qq.jpg");
   // BufferedImage ImageOne = ImageIO.read(fileOne);
   // int width = ImageOne.getWidth();//囄��宽度
   // int height = ImageOne.getHeight();//囄��高度

   // 对第二张囄��做相同的处理
   File fileTwo = new File("D:\\qq.jpg");
   BufferedImage ImageTwo = ImageIO.read(fileTwo);

   int width = ImageTwo.getWidth();// 囄��宽度
   int height = ImageTwo.getHeight();// 囄��高度
   int height2 = 20;

   BufferedImage ImageOne = new BufferedImage(width, height2,
     BufferedImage.TYPE_4BYTE_ABGR);
   // ImageOne.get

   Graphics g = ImageOne.getGraphics();//
   g.fillRect(0, 0, width, height);
   g.setColor(Color.blue);
   Font mFont = new Font("宋体", Font.PLAIN, 12);
   g.setFont(mFont);
   String text = "��d��文字��试";
   g.drawString(text, 0, 10);
   // 从图片中��d��RGB
   int[] ImageArrayOne = new int[width * height2];
   ImageArrayOne = ImageOne.getRGB(0, 0, width, height2,
     ImageArrayOne, 0, width);

   int[] ImageArrayTwo = new int[width * height];
   ImageArrayTwo = ImageTwo.getRGB(0, 0, width, height, ImageArrayTwo,
     0, width);

   // 生成新图�?br />    BufferedImage ImageNew = new BufferedImage(width, height + height2,
     BufferedImage.TYPE_INT_RGB);
   ImageNew.setRGB(0, 0, width, height2, ImageArrayOne, 0, width);// 讄��上半部分的RGB
   // ImageNew.setRGB(width,0,width,height,ImageArrayTwo,0,width);//讄��叛_��部分的RGB
   ImageNew.setRGB(0, height2, width, height, ImageArrayTwo, 0, width);// 讄��下半部分的RGB

   File outFile = new File("d:\\qq2.jpg");
   ImageIO.write(ImageNew, "jpg", outFile);// 写图�?br />   } catch (Exception e) {
   e.printStackTrace();
  }
}

风舞�׃ؕ 2009-10-14 10:11 发表评论

JS获取屏幕�Q�浏览器�Q�网��高度宽度[转]

风舞�׃ؕ — Fri, 26 Jun 2009 09:31:00 GMT

转自源码�|?br />
�|�页可见区域宽：document.body.clientWidth
�|�页可见区域高：document.body.clientHeight
�|�页可见区域宽：document.body.offsetWidth (包括边线的宽)
�|�页可见区域高：document.body.offsetHeight (包括边线的宽)
�|�页正文全文宽：document.body.scrollWidth
�|�页正文全文高：document.body.scrollHeight
�|�页被卷�ȝ��高：document.body.scrollTop
�|�页被卷�ȝ��左：document.body.scrollLeft
�|�页正文部分上：window.screenTop
�|�页正文部分左：window.screenLeft
屏幕分��L率的高：window.screen.height
屏幕分��L率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availHeight
屏幕可用工作区宽度：window.screen.availWidth

HTML�_��定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 获取对象的滚动高度�?
scrollLeft:讄��或获取位于对象左边界和窗口中目前可见内容的最左端之间的距��?
scrollTop:讄��或获取位于对象最��端和窗口中可见内容的最��端之间的距��?
scrollWidth:获取对象的滚动宽�?
offsetHeight:获取对象相对于版面或��q��坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或�?offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或�?offsetTop 属性指定的父坐标的计算��端位置
event.clientX 相对文档的水�q�_��?
event.clientY 相对文档的垂直��?
event.offsetX 相对容器的水�q�_��?
event.offsetY 相对容器的垂直坐�?
document.documentElement.scrollTop 垂直方向滚动的�?
event.clientX+document.documentElement.scrollTop 相对文档的水�q�_��?垂直方向滚动的量

IE�Q�FireFox 差异如下�Q?

IE6.0、FF1.06+�Q?

clientWidth = width + padding

clientHeight = height + padding

offsetWidth = width + padding + border

offsetHeight = height + padding + border

IE5.0/5.5�Q?
clientWidth = width - border

clientHeight = height - border

offsetWidth = width

offsetHeight = height

(需要提一下：CSS中的margin属性，与clientWidth、offsetWidth、clientHeight、offsetHeight均无�?

风舞�׃ؕ 2009-06-26 17:31 发表评论

色一情一区二区三区四区,99国产精品99久久久久久,国产精品一区在线观看

���谈如何提高AJAX客户端响应速度

���谈如何提高AJAX客户端响应速度

转脓] 谈不��h����q��80后，看来我们真的是老了吗？

JS获取屏幕�Q�浏览器�Q�网��高度宽度[转]

��谈如何提高AJAX客户端响应速度

��谈如何提高AJAX客户端响应速度

转脓] 谈不��h��q��80后，看来我们真的是老了吗？