Cách chèn Include Inline file css styles lên trên Razor View MVC

Thảo luận trong 'Lập Trình Website MVC5 & MVC6' bắt đầu bởi admin, 27/10/20.

  1. admin

    admin Phạm Công Sơn Thành viên BQT

    Tham gia ngày:
    22/5/13
    Bài viết:
    4,366
    Đã được thích:
    1,055
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Khi bạn tối ưu tốc độ web asp.net nói chúng hay các web ở mọi lĩnh vực khác nhau nói riêng, chúng ta thường gặp phải lỗi: Loại bỏ các tài nguyên chặn hiển thị - Các tài nguyên đang chặn lần hiển thị đầu tiên của trang. Hãy cân nhắc phân phối nội dòng JS/Biểu định kiểu xếp chồng (CSS) quan trọng và trì hoãn mọi JS/kiểu không quan trọng.

    Lỗi này rất khó chịu trên toàn bộ website đang sử dụng, việc tối ưu cứ nghĩ cực khó, ai dè nó lại quá dễ đơn giản ở mọi web khác nhau, chỉ là cách xử lý như trên code đó như thế nào thôi.

    Để loại bỏ lỗi này, đơn giản chúng ta đọc câu báo lỗi và suy nghĩ cách để đưa giải pháp như sau: các tài nguyên đang chặn hiển thị lần đầu tiên của trang => chúng ta gọi và cho nó chạy trước tiên ưu tiên cho nó, không phải load file css, chỉ cần load file html là đã có sẵn css ngay lập tức => giải pháp đã được giải quyết xong.

    Vậy cho css vào html trực tiếp như thế nào? trong code được gọi là kỹ thuật inline css.

    Vậy để Include Inline file css styles trong MVC như thế nào?

    Bạn add code sau vào web của bạn ở Class bất kỳ, thường mình hay có 1 cái class dùng chung các code xử lý gọi chung là Code.css (của bạn nó tên gì hoặc thích chèn ở đầu thì chèn theo ý nhé).
    Mã:
     
    public static string InlineFile(string path)
    {
          return System.IO.File.ReadAllText(path);
    }
    
    • Tiếp theo bạn tới Razor View cshtml của bạn chèn code sau vô":
    Mã:
    <style media="all">
        @Html.Raw(XString.InlineFile(Server.MapPath("/content/styles.min.css")));
    </style>
    • Tùy vào tên css của bạn là gì thì đổi lại theo nhé (nên sử dụng min css để đạt hiểu quả tối ưu nhất)
    Đọc tiếp bài sau để biế cách tối ưu 100đ cho web: https://itseovn.com/threads/toi-uu-toc-do-pagespeed-mvc-asp-net-toan-tap.320598/
     
    Cảm ơn đã xem bài:

    Cách chèn Include Inline file css styles lên trên Razor View MVC



Like và Share ủng hộ ITSEOVN