N Petua untuk Menulis Petua Javascript Code_javascript Berprestasi Tinggi

WBOY
Lepaskan: 2016-05-16 15:36:51
asal
967 orang telah melayarinya

Selama bertahun-tahun, Javascript telah memainkan peranan penting dalam pembangunan aplikasi web, tetapi banyak pembangun sering mengabaikan beberapa pengetahuan prestasi Terutama dengan peningkatan berterusan perkakasan komputer, pembangun semakin bimbang tentang pengoptimuman prestasi Javascript kesan yang jelas terhadap kecekapan pelaksanaan halaman web. Tetapi dalam beberapa kes, kod Javascript yang tidak dioptimumkan pasti akan menjejaskan pengalaman pengguna. Oleh itu, walaupun dalam era semasa apabila prestasi perkakasan telah bertambah baik, apabila menulis kod Javascript, jika anda boleh mengikuti spesifikasi Javascript dan memberi perhatian kepada beberapa pengetahuan prestasi, ia akan memberi manfaat yang besar untuk meningkatkan kebolehselenggaraan kod dan mengoptimumkan prestasi .

  Berikut ialah beberapa cadangan untuk menulis kod Javascript berprestasi tinggi:

1. Cuba jangan gunakan gelung untuk masuk untuk mengakses tatasusunan Adalah disyorkan untuk menggunakan gelung ke gelung:   

.
function foo() {
   var i, b, c=[,,];
   for (i in c) {
    b = c[i];
    if(b === "")
     return b;
   }
  }
  //性能更好
  function foo() {
   var i, b, c=[,,];
   for (i=;i<c.length;i++) {
    b = c[i];
    if(b === "")
     return b;
   }
  } 
Salin selepas log masuk

2. Adalah disyorkan untuk cache objek, terutamanya akses DOM, yang menggunakan sumber:

 //c.length没有缓存,每次迭代都要计算一下数组的长度
  function foo() {
   var i, b, c=[,,];
   for (i=;i<c.length;i++) {
    b = c[i];
    if(b === "")
     return b;
   }
  }
  //性能更好,第一次将数组的长度缓存到变量l中,第二次及后续的循环无需计算数组长度
  function foo() {
   var i, b, c=[,,],l;
   for (i=,l=c.length;i<l;i++) {
    b = c[i];
    if(b === "")
     return b;
   }
  }

  //document.getElementById('info')没有缓存,每次都要遍历DOM
  function foo() {
   var e;
   document.getElementById('info').innerHTML="call ";
   document.getElementById('info').innerHTML="call ";
   
  }
  //性能更好,第二次无需访问DOM
  function foo() {
  var e=document.getElementById('info');
  e.innerHTML="call ";
   e.innerHTML="call ";
  }
Salin selepas log masuk

 3. Adalah disyorkan untuk tidak membuat pertimbangan bersarang terlalu dalam dalam fungsi:

//函数内嵌套判断语句过多
  function foo1() {
   var r={};
   r.data={};
   r.data.myProp=2;
   if (r) {
   if (r.data) {
    if (r.data.myProp) {
     //逻辑处理
    } 
    else {
     //逻辑处理
    }
   }
 }
 }
  //性能更好
 function foo2() {
   var r={};
   r.data={};
   r.data.myProp=2;
  if (!r) return;
  if (!r.data) return;  
  if (r.data.myProp) {
   //逻辑处理
  } else {
    //逻辑处理
  }
 }
Salin selepas log masuk

4. Elakkan rujukan bulat dan elakkan kebocoran ingatan:

//需要jQuery
 function foo(e,d) {
  $(e).on("click", function() {
    //对d进行逻辑处理
    cbk(d);
      } 
  });
 }
 //打破循环!
 function foo(e, d) {
  $(e).on("click", cbk(d));
 }
 function cbk (d) {
 //逻辑处理
 }  
Salin selepas log masuk

 5 Adalah disyorkan untuk mengelak daripada mengembalikan pembolehubah yang tidak diisytiharkan dalam fungsi, yang akan mencemarkan pembolehubah luaran:

 function foo(a, b) {
  r = a + b;
  return r; //r未声明,则创建了一个全局变量
 }
Salin selepas log masuk

 6. var mengisytiharkan pembolehubah adalah disyorkan untuk menulisnya dalam berbilang baris

 //自己测试结果是foo快,但也有一种观点是foo快
 function foo() {
  var c = ;
  var sum=;
  var d = ;
  var e;
 }
 function foo() {
  var c = ,sum=, d = , e;
 }
Salin selepas log masuk

Nota: Sebenarnya, perbezaan dalam masa satu fungsi adalah kecil Di sini kami menggunakan masa terkumpul untuk menggelung beberapa kali untuk perbandingan prestasi Mungkin terdapat perbezaan dalam keputusan ujian konfigurasi atau penyemak imbas PC yang berbeza.

Kandungan di atas ialah N cadangan untuk menulis kod Javascript berprestasi tinggi Saya harap ia akan membantu semua orang.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan