Trik Dan Tips Cara Load Css Eksternal Tanpa Menunda Rendering
Cara Load CSS Eksternal Tanpa Menunda Rendering - Umumnya sebuah situs web / blog tidak terlepas dari stylesheet css external. Namun terka...
https://tutorialcarapintar.blogspot.com/2019/02/trik-dan-tips-cara-load-css-eksternal.html
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }loadCSS("//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css");loadCSS("https://fonts.googleapis.com/css?family=Oswald:400,600");
</script> Kelebihan LoadCSS.JS
Penempatan (Pemasangan) Script Load CSS
Jika instruksi css external default biasanya terletak pada area (antara <head>...dan...</head>) maka load css dengan javascript diletakkan di area body (antara <body>...dan...</body>. Mungkin pada template situs anda sudah terdapat kumpulan javascript internal maka kau sanggup menggabungkan javascript load css tersebut dengan javascript internal yang sudah ada.
</script> Kelebihan LoadCSS.JS
- Support dibanyak browser menyerupai Google Chrome, Mozilla, IE, UC dan lain-lain
- Mengatasi blokir render halaman paruh atas, dan
- Mempercepat loading (pemuatan) website
Penempatan (Pemasangan) Script Load CSS
Jika instruksi css external default biasanya terletak pada area (antara <head>...dan...</head>) maka load css dengan javascript diletakkan di area body (antara <body>...dan...</body>. Mungkin pada template situs anda sudah terdapat kumpulan javascript internal maka kau sanggup menggabungkan javascript load css tersebut dengan javascript internal yang sudah ada.
Buang instruksi pembungkus javascript yaitu "<script type='text/javascript'>" dan "</script>" menyerupai yang telah aku terapkan pada situs ini. Silahkan lihat teladan gambar dibawah ini;
Jika telah memasang script loadCss.js maka instruksi default stylesheet css external tidak diharapkan lagi, silahkan hapus instruksi default stylesheet css dari html situs web anda lalu pertinjau situs dan uji dengan tool google page speed insights.
Saya fikir kini aku tidak diharapkan lagi disini lantaran solusi mengatasi render-blocking css external sudah anda temukan dan sudah waktu nya untuk memperbaiki performa situs web anda menjadi lebih baik dengan code loadcss.js diatas. Jangan lupa follow situs ini untuk mendapat update trik-trik blogging, javascript dan css menarik lain-nya. Semoga ini sanggup bermanfaat dan membantu mengatasi permasalahan css external situs web kesayangan kamu. Sampai jumpa kembali di tutorial berikutnya and good luck for you.
 |
| Cara memasang LoadCSS.Js |
Saya fikir kini aku tidak diharapkan lagi disini lantaran solusi mengatasi render-blocking css external sudah anda temukan dan sudah waktu nya untuk memperbaiki performa situs web anda menjadi lebih baik dengan code loadcss.js diatas. Jangan lupa follow situs ini untuk mendapat update trik-trik blogging, javascript dan css menarik lain-nya. Semoga ini sanggup bermanfaat dan membantu mengatasi permasalahan css external situs web kesayangan kamu. Sampai jumpa kembali di tutorial berikutnya and good luck for you.
