UCHOME里面一个JS性能比较严重的问题--不把内存当回事

熟悉UCHOME的朋友可以

模板文件中的space_status.htm这个文件，也就是发布心情记录的地方
这里有一个很严重的问题
如果用户不停的点发布心情的文本框，让它获得焦点，在失去焦点，那么内存无限的增长，最后浏览器只能挂掉了
取出原始文件中的一段出来:

1. 
   
2. var div = $('mood_face_bg');
   
3. if(div) {
   
4. div.parentNode.removeChild(div);
   
5. }
   
6. div = document.createElement('div');
   
7. div.id = 'mood_face_bg';
   
8. div.style.position = 'absolute';
   
9. div.style.left = div.style.top = '0px';
   
10. div.style.width = '100%';
    
11. div.style.height = document.body.scrollHeight + 'px';
    
12. div.style.backgroundColor = '#000';
    
13. div.style.zIndex = 10000;
    
14. div.style.display = 'none';
    
15. div.style.filter = 'alpha(opacity=0)';
    
16. div.style.opacity = 0;
    
17. div.onclick = function() {
    
18. hiddenstatus();
    
19. }
    
20. $('append_parent').appendChild(div);
    

复制代码

此段代码完全是在自残,不断的生成去除元素节点,而且主要是生成一个跟页面大小一样的层，要命啊
这种情况，测试了一下，内存是成倍的增长的,难怪一个MM同事说浏览器太卡，点不动

简单的优化一下：

1. 
   
2. var div = $('mood_face_bg');
   
3. if(div) {
   
4.   div.style.display = 'none';  //不用去掉，只用隐藏一下就OK
   
5. } else {
   
6. div = document.createElement('div');
   
7. div.id = 'mood_face_bg';
   
8. div.style.position = 'absolute';
   
9. div.style.left = div.style.top = '0px';
   
10. div.style.width = '100%';
    
11. div.style.height = '900px'; //宽度自己设定一个固定的好点，不然页面要是很长很长，那内存伤不起啊
    
12. div.style.backgroundColor = '#000';
    
13. div.style.zIndex = 10000;
    
14. div.style.display = 'none';
    
15. div.style.filter = 'alpha(opacity=0)';
    
16. div.style.opacity = 0;
    
17. div.onclick = function() {
    
18. hiddenstatus();
    
19. }
    
20. $('append_parent').appendChild(div);
    
21. }

复制代码

转载请写明出处：www.onlypo.com