Google PageSpeed sık optimize CSS delivery öneriyor. Ağ durumsa bu gibi tüm CSS satır içi azaltacağını aklıma geldi

<style type="text/css">

    @{ 
        var bootstrap = File.ReadAllText(Server.MapPath("bootstrap.min.css"));
        var bootstrapTheme = File.ReadAllText(Server.MapPath("theme.min.css"));
        var fontAwesome = File.ReadAllText(Server.MapPath("font-awesome.min.css"));
        var bigfont = File.ReadAllText(Server.MapPath("bigfont.min.css"));
        var bigfontPrint = File.ReadAllText(Server.MapPath("bigfont-print.min.css"));
    }

    @Html.Raw(bootstrap)
    @Html.Raw(bootstrapTheme)
    @Html.Raw(fontAwesome)
    @Html.Raw(bigfont)
    @Html.Raw(bigfontPrint)

</style>

Bu yavaş sayfa yük soruna makul bir çözüm gibi görünüyor ve 88'den 95'e PageSpeed benim puan arttı.

Kod tarzı bir an için bir kenara koyarak, ne varsa teknik nedenlerden dolayı, astar bu şekilde tüm CSS için var?

Tüm CSS satır içi uygulaması her sayfa yük CSS gereken tüm bilgiyi içerir yani önbelleğe olamaz anlamına gelir, ve büyük kütüphaneler kullanırken gerçekten boşa bant genişliği bir sürü olabilir. Örneğin, Bootstrap 120 k civarında. Not paylaşılan Google link aşağıdaki (vurgu benim) belirtir:

Harici CSS kaynakları ise küçükdoğrudan satır içi uygulaması olarak adlandırılan HTML belgesi içine bu ekleyebilirsiniz.

Tek sayfa bir yük daha hızlı olabilir ama genel olarak çok yavaş olabilir.

Şahsen uzak ki. Ancak, yapabileceğiniz bir şey olduğunu bundle tüm CSS içine bir tek isteği (kullandığınız MVC, böylece nispeten basit) yani sadece bir tek ekstra gezi için bir sunucu için CSS ve gelecekteki tüm sayfaları tarafından talep edilen tarayıcı değil sorması gerekir onları yeniden.