, Cara membuat asinc pada html | MEMAHAMI DAN OPTIMASI WEB

Cara membuat asinc pada html

Kode Pelacakan Quickstart.
Analytics snippet adalah bagian kecil dari kode JavaScript yang Anda paste ke halaman Anda. Ini mengaktifkan pelacakan Google Analytics dengan memasukkan ga.js ke dalam halaman. Untuk menggunakan ini pada halaman Anda, salin potongan kode di bawah ini, menggantikan UA-XXXXX-X dengan ID properti web Anda. Tempel potongan ini ke halaman template website Anda sehingga muncul sebelum </ head> tag penutup.
Jika Anda perlu melakukan lebih dari pelacakan laman dasar, melihat referensi pelacakan untuk daftar metode yang tersedia di API dan lihat Panduan Penggunaan untuk rincian tentang menggunakan sintaks asynchronous. Untuk langkah-demi-langkah petunjuk tentang pengaturan pelacakan, lihat artikel Pusat Bantuan tentang pengaturan pelacakan.

<Script type = "text / javascript">
  var _gaq = _gaq || [];
  _gaq.push ([ '_ setAccount', 'UA-XXXXX-X']);
  _gaq.push ([ '_ trackPageview']);
  (Function () {
    var ga = document.createElement ( 'script'); ga.type = 'text / javascript'; ga.async = true;
    ga.src = ( 'https:' == document.location.protocol 'https: // ssl': 'http: // www'?) + '.google-analytics.com / ga.js';
    var s = document.getElementsByTagName ( 'script') [0]; s.parentNode.insertBefore (ga, s);
  }) ();
</ Script>

Cuplikan di atas merupakan konfigurasi minimum yang diperlukan untuk melacak halaman asynchronous. Menggunakan _setAccount untuk mengatur halaman ID properti web dan kemudian panggilan _trackPageview untuk mengirim data pelacakan kembali ke server Google Analytics.
Penting: 
Jika Anda memperbarui halaman Anda dari potongan tradisional untuk versi terbaru, versi asynchronous, Anda harus menghapus cuplikan pelacakan yang ada pertama. Kami tidak menyarankan menggunakan kedua potongan bersama-sama pada halaman yang sama. Untuk petunjuk migrasi, lihat Migrasi ke Async.
Bagaimana Asynchronous Sintaks worker.
Objek _gaq adalah apa yang membuat sintaks asynchronous semaksimal mungkin. Bertindak sebagai antrian, yang merupakan first-in, first-out struktur data yang mengumpulkan panggilan API sampai ga.js siap untuk mengeksekusi mereka. Untuk menambahkan sesuatu ke antrian, menggunakan metode _gaq.push.
Untuk mendorong panggilan API ke antrian, Anda harus mengubahnya dari sintaks JavaScript tradisional menjadi array perintah. array perintah hanya array JavaScript yang sesuai dengan format tertentu. Elemen pertama dalam array perintah adalah nama dari metode tracker objek yang Anda ingin menyebutnya. Ini harus menjadi string. Sisa dari elemen adalah argumen Anda ingin lolos ke metode tracker objek. Ini dapat berupa nilai JavaScript.
Kode berikut panggilan _trackPageview () menggunakan sintaks tradisional:

var pageTracker = _gat._getTracker ( 'UA-XXXXX-X');
pageTracker._trackPageview ();
Kode setara dalam sintaks asynchronous membutuhkan dua panggilan ke _gaq.push.
_gaq.push ([ '_ setAccount', 'UA-XXXXX-X']);
_gaq.push ([ '_ trackPageview']);
Dalam sintaks asynchronous, penciptaan objek tracker tersirat, tapi kita masih perlu cara untuk mengatur web ID properti untuk pelacak. Metode _setAccount telah ditambahkan untuk memberikan kemampuan ini. Semua metode tracker objek lain adalah sama di kedua pelacakan asynchronous dan tradisional. Hanya sintaks yang berbeda.
Untuk informasi lebih lanjut tentang sintaks asynchronous, lihat Referensi Tracking untuk metode _gaq.push.
Kembali ke atas
Pelacakan dengan HTML Acara Handler
Sintaks pelacakan asynchronous juga harus digunakan dari dalam DOM event handler. Misalnya, tombol ini menghasilkan suatu peristiwa ketika diklik.
<Button onclick = "_ gaq.push ([ '_ trackEvent', 'Tombol3', 'diklik'])"> </ button>
Bahkan jika tombol ini diklik sebelum browser telah selesai memuat ga.js, acara tersebut akan ditangkap dan akhirnya dieksekusi. Menggunakan pelacakan tradisional, browser mungkin melemparkan pengecualian dalam situasi ini.

Mendorong Fungsi ke antrian

Selain perintah array, Anda juga dapat memasukkan kode fungsi ke antrian _gaq. Function dapat mengandung JavaScript sewenang-wenang dan seperti array perintah, mereka dieksekusi dalam urutan di mana mereka didorong ke _gaq. Teknik ini berguna untuk memanggil API pelacakan yang kembali nilai-nilai. Sebagai contoh, kode berikut membangun URL linker dan menetapkan properti href untuk link dengan hasilnya.

_gaq.push (function () {
  var pageTracker = _gat._getTracker ( 'UA-XXXXX-X');
  var link = document.getElementById ( 'saya-link-id');
  link.href = pageTracker._getLinkerUrl ( 'http://example.com/');
});

Contoh di atas menggunakan _gat untuk membuat objek tracker, tapi karena ditugaskan untuk variabel lokal, kode luar fungsi tidak bisa menggunakannya. Sementara ini dapat diterima, Anda dapat menggunakan metode _gat._createTracker untuk membuat permanen, objek diakses secara global. 
Kode berikut menunjukkan bagaimana ini akan bekerja:

_gaq.push (function () {
  var pageTracker = _gat._createTracker ( 'UA-XXXXX-X', 'myTracker');
  var link = document.getElementById ( 'saya-link-id');
  link.href = pageTracker._getLinkerUrl ( 'http://example.com/');
});
_gaq.push ([ 'myTracker._trackPageview']);
Contoh di atas menciptakan tracker asynchronous dalam fungsi dan kemudian referensi nanti dengan nama dalam array perintah.
Kasus penggunaan sebaliknya juga mungkin. Misalnya, jika Anda perlu menggunakan objek tracker asynchronous dibuat melalui yang sebelumnya mendorong perintah array, menggunakan metode _gat._getTrackerByName. 
Kode berikut menunjukkan cara kerjanya.

_gaq.push ([ 'myTracker._setAccount', 'UA-XXXXX-X']);
_gaq.push (function () {
  var pageTracker = _gat._getTrackerByName ( 'myTracker');
  var link = document.getElementById ( 'saya-link-id');
  link.href = pageTracker._getLinkerUrl ( 'http://example.com/');
});

Satu push, beberapa Perintah.
Daripada mengetik _gaq.push (...) untuk setiap panggilan, Anda dapat mendorong semua perintah Anda sekaligus. Kode berikut menunjukkan teknik ini.

_gaq.push (
  [ '_setAccount', 'UA-XXXXX-X'],
  [ '_setDomainName', 'Example.com'],
  [ '_setCustomVar', 1, 'Bagian', 'Life & Style', 3],
  [ '_trackPageview']
);

Ini bekerja karena metode _gaq.push meniru metode Array.push, yang memungkinkan mendorong beberapa item dengan satu doa.

Membelah Cuplikan
Jika Anda lebih memilih untuk menempatkan Potongan Analytics di bagian bawah halaman, Anda harus tahu bahwa Anda tidak harus meletakkan seluruh potongan di bagian bawah. Anda masih dapat menyimpan sebagian besar manfaat pembebanan asynchronous dengan memisahkan potongan setengah-menjaga babak pertama di bagian atas halaman dan pindah sisanya ke bawah. Karena bagian pertama dari cuplikan pelacakan memiliki sedikit tidak berpengaruh pada halaman rendering, Anda dapat meninggalkan bagian di bagian atas dan menempatkan bagian dari cuplikan yang menyisipkan ga.js di bagian bawah.
Sebuah halaman dengan perpecahan cuplikan asinkron setengah mungkin terlihat seperti ini:
<Html>
<Head>
  <Script type = "text / javascript">
    var _gaq = _gaq || [];
    _gaq.push ([ '_ setAccount', 'UA-XXXXX-X']);
    _gaq.push ([ '_ trackPageview']);
  </ Script>
</ Head>
<Body>
  <P> Page Konten </ p>
  <Script src = "some_random_script.js"> </ script>
  <P> Page Konten </ p>
  <Script type = "text / javascript"> (function () {
    var ga = document.createElement ( 'script'); ga.type = 'text / javascript'; ga.async = true;
    ga.src = ( 'https:' == document.location.protocol 'https: // ssl': 'http: // www'?) + '.google-analytics.com / ga.js';
    var s = document.getElementsByTagName ( 'script') [0]; s.parentNode.insertBefore (ga, s);
    }) ();
   </ Script>
</ Body>
</ Html>
Kedua potongan kode harus dibungkus dalam tag naskah mereka sendiri, tetapi hanya enam baris terakhir dari aslinya asynchronous kebutuhan cuplikan dipindahkan ke bawah. Semua baris yang mendorong metode ke _gaq dapat tinggal di atas.

Menghindari Kesalahan Umum.
Bila menggunakan baik asynchronous atau sintaks tradisional, perlu diingat berikut:
nama metode adalah case-sensitive.
Jika Anda menggunakan nama metode tanpa casing yang tepat, metode panggilan Anda tidak akan bekerja. contoh:
_gaq.push ([ '_ trackPageview']); // buruk
_gaq.push ([ '_ trackPageview']); // baik
Gunakan nama yang benar.
Jika pelacakan Anda tidak bekerja dengan benar, periksa untuk memastikan Anda menggunakan nama yang benar untuk metode. 
contoh:
_gaq.push ([ '_ setDomain', 'example.com']); // buruk
_gaq.push ([ '_ setDomainName', 'example.com']); // baik
Hanya string yang harus berlalu dalam dengan tanda kutip. Semua jenis lainnya harus dibiarkan kuotasi.
Setiap nilai yang tidak string, seperti boolean, literal objek, fungsi atau array, harus lulus tanpa tanda kutip. Gunakan hanya tanda kutip ketika Anda lewat di sesuatu yang dimaksudkan untuk ditafsirkan sebagai string. Jika Anda bermigrasi dari sintaks tradisional, setiap parameter fungsi yang disahkan tanpa tanda kutip harus tetap kuotasi dalam sintaks asynchronous. 
contoh:
_gaq.push ([ '_ setAllowLinker', 'palsu']); // buruk
_gaq.push ([ '_ setAllowLinker', false]); // baik
Pastikan bahwa string tidak mengandung terkemuka atau trailing spasi.
contoh:
_gaq.push ([ '_ setAccount', 'UA-65432-1']); // buruk
_gaq.push ([ '_ setAccount', 'UA-65432-1']); // baik
Share on Google Plus

0 komentar:

Untuk Melanjutkan Membaca Silahkan Lengkapi Form Ini