MVC 4 فقط یک سری افزونه بیشتر از MVC3 داره. مثلا razor آن بهبود پیدا کرده، فشرده سازی فایل‌های CSS به اون اضافه شده یا Web API رو به صورت یکپارچه داره. از لحاظ کار با فایل‌های منبع فرقی نکرده.
Refactoring فایل‌های CSS به LESS 
یکی از پروسه‌های بهبود سئو وب سایت کاهش حجم نهایی فایل‌های CSS و JS می‌باشد که به آن Minification یا Minimization گفته می‌شود. این عمل موجب حذف شدن کامنت‌ها، فضاء خالی بین دستورات و ... می‌گردد. در سوی دیگر با عمل فشرده سازی کدهای نهایی جاوااسکریپت و سی اس اس موجب عدم خوانایی بهتر این دستورات برای انسان‌ها می‌شود.
نکته بسیارمهم : در حین انتقال لینک فایل‌های css و js به صفحه index.html در دایرکتوری public حتما قبل از مسیرها عبارت %PUBLIC_URL%/ یا از / را در ابتدای آدرس ذکر کنید.
نمونه:
<link rel="stylesheet" href="dist/css/adminlte.min.css" />
به
<link rel="stylesheet" href="%PUBLIC_URL%/dist/css/adminlte.min.css" />
<link rel="stylesheet" href="/dist/css/adminlte.min.css" />
در صورت عدم اصلاح، در زمان مسیریابی ، زمانی که شاخه جدیدی یا پارامتر جدید به مسیر اضافه شود، آدرس دهی فایل‌ها از کار خواهد افتاد.
به عنوان مثال در چنین آدرس صفحه بدون مشکل در دسترس است:
http://localhost:3000/domain
زمانی که به ادرس زیر تغییر کند مسیر فایل‌های css و js دیگر به درستی تشخیص داده نخواهد شد.
http://localhost:3000/domain/1
با این سایت می‌توانید فایل‌های Css خود را به صورت inline در HTML تبدیل کنید
- خب البته من این رو در حین کار با فایل‌های SVG یاد گرفتم؛ برای اینکه بتونم روی فایل‌های SVG تولید شده توی برنامه ام مدیریت بهتری داشته باشم، دنبال راهی بودم که تصاویر رو درون اون Embed کنم. که با این راه آشنا شدم.
- برای فایل‌های HTML و CSS کاربرد خاصی نمیتونم مثال بزنم؛ شایدم اصلا کاربرد خاصی نداشته باشه!. ولی توی کار با فایل‌های SVG میتونه مفید واقع بشه و خیالتون رو در مورد Lost شدن تصاویر راحت کنه. هرچند که کلا این روش برای تصاویر حجیم مناسب نیست.
یک نکته‌ی تکمیلی
به مستندات رسمی AngularJS 2.0، فصل جدیدی به نام «Introduction to Webpack» اضافه شده‌است. در اینجا می‌توان Webpack را جایگزین Gulp کرد و نکته‌ی جالب آن، امکان نوشتن یک چنین کامپوننت‌هایی هستند:
در اینجا معرفی template و css جداگانه‌ی تعریف شده‌ی در فایل‌های مجزای خودشان، توسط متد require مربوط به webpack انجام شده‌اند. مزیت آن این است که زمانیکه webpack کار bundling برنامه را انجام میدهد، تک فایل js حاصل، حاوی تمام فایل‌های html و css برنامه هم خواهد بود و دیگر نیازی به توزیع جداگانه‌ی آن‌ها نیست. به عبارتی شما در حین تهیه‌ی برنامه، inline کار نمی‌کنید، اما webpack آن‌ها را حین توزیع نهایی، به صورت خودکار تبدیل به قالب‌ها و شیوه‌نامه‌های inline می‌کند.
به مستندات رسمی AngularJS 2.0، فصل جدیدی به نام «Introduction to Webpack» اضافه شده‌است. در اینجا می‌توان Webpack را جایگزین Gulp کرد و نکته‌ی جالب آن، امکان نوشتن یک چنین کامپوننت‌هایی هستند:
import { Component } from '@angular/core';
import '../../public/css/styles.css';
@Component({
selector: 'my-app',
template: require('./app.component.html'),
styles: [require('./app.component.css')]
})
export class AppComponent { } در حین ایندکس کردن، بجای StandardAnalyzer، نیاز خواهید داشت یک PersianNormalizer سفارشی را استفاده کنید که در مطلب « استفاده از Luke برای بهبود کیفیت جستجوی لوسین » به آن اشاره شده‌است.
استفاده از یک Middleware سفارشی جهت فشرده سازی فایل‌های CSS ،js و سفارشی سازی آن
