Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın Çözümü

812 görüntüleme 29 Eylül 2017 CSS

Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın Çözümü

Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın Çözümü
ahmet hakan avatar

Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın Çözümü

Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın

Sayfanızda oluşturmayı engelleyen 6 tane CSS kaynağı var. Bu durum, sayfanızın oluşturulmasında gecikmeye neden oluyor.
Sayfanızda ekranın üst kısmındaki içerikten hiçbiri aşağıdaki kaynakların yüklenmesi beklenmeden oluşturulamadı. Engelleyen kaynakları ertelemeyi veya eşzamansız olarak yüklemeyi ya da bu kaynakların önemli miktarda bölümünü doğrudan HTML’de satır içi yapmayı deneyin.

Eğer sizde daha önce internet sitesi açtıysanız yukarıdaki hatayı daha önce görmemiş olma olasılığınız çok düşük.
Bugün sizlere bu hatadan kurtulmanın yolunu göstereceğim.

Tarayıcı ile bir siteyi ziyaret ettiğiniz zaman internet tarayıcınız sayfayı ekranda oluşturmadan önce sayfaya dışarıdan çağırılan dosyaları yüklemelidir. Böyle olunca sayfaya çağırılan boyutu ve sayısı yüksek olan CSS ve JavaScript dosyaları ziyaretçinin sayfayı görüntülemek için beklemesi gereken süreyi arttırıyor.

Javascript Dosyaları İçin Çözüm

Javascript dosyalarınızı aşağıdaki şekilde çağırarak bu sorunu çözebilirsiniz. Defer özelliği javascript dosyalarının sayfa tamamen yüklendikten sonra yüklenmesini sağlar.

<script type='text/javascript' src='jquery.min.js' defer='defer'>

veya

<script type='text/javascript' src='jquery.min.js' defer>

WordPress için
aşağıdaki kodu temanızın functions.php (tema işlevleri) dosyasına ekleyin.

/*
 * Defer Javascript
 */
add_filter( 'clean_url', function( $url )
{
    if ( FALSE === strpos( $url, '.js' ) )
    {
        return $url;
    }
    return "$url' defer='defer";
}, 11, 1 );

CSS Dosyaları için Çözüm

CSS dosyalarınız çağırıldığı kod bölümünü <noscript> etiketleri içine almalısınız.

Örnek:

daha sonra sayfanızın alt bölümüne aşağıdaki javascript kodlarını ekleyin.

Bu kod sayesinde ilk önce sayfa yüklenecek daha sonra sayfaya çağrılan dosyalar yüklenecek en sonunda ise CSS kodları ile sayfanın görüntüsü oluşturulacak.

493

Oluşturmayı önleyen JavaScript ve CSS kodlarını ekranın üst kısmındaki içerikten kaldırın Çözümü için yorumlar