Mengapa demikian, oleh karena ketika Anda membuat taut ke sebuah laman di situsweb lain dengan menggunakan atribut target="_blank", maka Anda bisa membuat situsweb Anda terpapar dengan masalah kinerja dan keamanan.
Sebabnya adalah laman target tautnya bisa pula menjalankan proses yang sama dengan laman Anda itu. Jika laman tersebut menjalankan banyak proses yang melibatkan JavaScript, maka kinerja laman situsweb Anda bisa terkena dampak yang buruk.
Laman target taut Anda itu juga bisa mengakses objek jendela laman Anda dengan memasang window.opener property, yang memungkinkan laman target itu melakukan redirect laman situsweb Anda ke alamat URL yang berbahaya.
Solusinya adalah dengan menambahkan atribut rel="noopener" atau rel="noreferrer" ke taut yang ada atribut target="_blank" untuk menghindari masalah ini. Jika Anda sudah memasang atribut rel="nofollow", maka ubah menjadi rel="nofollow noopener".
Misalnya ada taut ke,
<a href="https://www.aroengbinang.com/p/koleksi-foto-taman-burung.html" target="_blank">Foto Taman Burung</a>
ganti menjadi,
<a href="https://www.aroengbinang.com/p/koleksi-foto-taman-burung.html" rel="noopener" target="_blank">Foto Taman Burung</a>
Audit dengan Lighthouse menggunakan sejumlah proses untuk mengetahui apakah sebuah taut masuk ke dalam kategori tidak aman. Diantaranya adalah dengan mengumpulkan semua tag yang berisi atribut target="_blank" namun tidak memiliki atribut rel="noopener" atau rel="noreferrer".
Karena dalam auditnya Lighthouse mengeluarkan semua taut ke host yang sama, sehingga jika ada laman lain di situsweb Anda yang juga membuat taut dengan atribut target="_blank" dan tanpa memakai atribut rel="noopener", maka pengaruh ke kinerja dan keamanan tetap berlaku bagi laman itu. Namun seluruh taut lain yang tak aman itu tak terlihat di audit Lighthouse. Ini yang perlu Anda waspadai.
Oleh sebab itu, ketika memakai atribut target="_blank", selalu tambahkan atribut rel="noopener" atau rel="noreferrer" dalam tautnya. Adanya atribut rel="noopener" mencegah laman target untuk bisa mengakses window.opener property dan memastikannya menjalani proses yang terpisah. Sedangkan penambahan atribut rel="noreferrer", selain juga mempunya fungsi yang sama sebagaimana rel="noopener", juga mencegah Referer header untuk dikirim ke laman target.
Label: Lighthouse, Tutorial
Bagikan ke: WhatsApp, Email. Print!.
