网站优化攻略

1、在<Head>上添加样式：

  • 尽量不用内联样式和内部样式

  • 使用外部样式表并将它们放在<Head>标签下

2、把javascript放到body标签的底部

在<script src=”PATH_TO_SCRIPT” defer/>中使用defer标签以防止javascript脚本阻止页面html的呈现。

3、添加网站Logo图标，如果是ASP.NET MVC应用程序，记得在过滤规则中添加排除：

routes.IgnoreRoute("{*favicon}", new { favicon = @"(.*/)?favicon.ico(/.*)?" })

4、通过使用CSS sprites减少对静态数据的请求


5、配置IIS和你的webapp gzip和缓存

<system.webServer>
    <staticContent>
      <remove fileExtension=".js" />
      <remove fileExtension=".css" />
      <mimeMap fileExtension=".js" mimeType="text/javascript" />
      <mimeMap fileExtension=".css" mimeType="text/css" />
      <clientCache cacheControlCustom="public" 
      cacheControlMode="UseMaxAge" cacheControlMaxAge="500.00:00:00" />
    </staticContent>
    <urlCompression doStaticCompression="true" doDynamicCompression="true" />
</system.webServer>

 6、减少CSS和JavaScript文件

为了尽量减少你的CSS和JavaScript文件，您需要安装squishit和squishit MVC的扩展。就我个人而言，我更喜欢squishit捆在ASP.NET。下面的语法可以用在你的视图来减少CSS文件：

@(Bundle.Css()
.Add("~/Content/base.css")
.Add("~/Content/CSS/Plugins/BootstrapDatepicker/daterangepicker-bs3.css")
.MvcRender("~/Content/CSS/min/combined_#.css"))

 以下用来减少JavaScript:

@(Bundle.JavaScript()
.Add(@"~/Scripts/lib/jquery-2.0.2.min.js")
.Add(@"~/Scripts/lib/jquery.slimscroll.min.js")
.Add(@"~/Scripts/lib/jquery-ui-1.10.3.custom.min.js")
.Add(@"~/Scripts/lib/typeahead.min.js")
.Add(@"~/Scripts/lib/daterangepicker.js")
.Add(@"~/Scripts/lib/moment.min.js")
.MvcRender("~/Scripts/min/combined_#.js"))

7、对于那些使用窗体进行验证的web应用程序，这种优化是强制性的。你或许会问为什么？当用户经过了验证，web应用将会创建一个验证的Cookie，这个Cookie是经过安全加密的，大小在2KB。你浏览器的每一次对静态资源（图片，CSS文件，JavaScript文件）的请求都会包含该Cookie。因此当我们后退或前进时对每次请求都会有2KB的消耗。这是非常糟糕的！我们有两个方面要解决： 

  • 支付内容交付网络

  • 在浏览器中欺骗

第一条很容易解决，让我们来解决第二条。在你的文件中创建一个CNAME（别名）命名cdn.yourwebsite.com。将别名指向您的网站应用程序域。

现在，我们将使用一个改进的MVC版本缓存断路器：

namespace System.Web.Mvc
{
    public static class CdnExtensions
    {
        private static readonly Regex ScriptRegex = new Regex
        ("<script.+?src=[\"'](.+?)[\"'].*?>", 
        RegexOptions.Compiled | RegexOptions.IgnoreCase | RegexOptions.Multiline);
        private static readonly Regex CssRegex = new Regex("<link.+
        ?href=[\"'](.+?)[\"'].*?>", 
        RegexOptions.Compiled | RegexOptions.IgnoreCase | RegexOptions.Multiline);
 
        public static string CdnContent(this UrlHelper url, string link, bool isDynamicResource = false)
        {
            link = link.ToLower();
 
            // last write date ticks to hex
            string cacheBreaker = string.Empty;
 
            if (!isDynamicResource)
            {
                cacheBreaker = Convert.ToString(File.GetLastWriteTimeUtc
                (url.RequestContext.HttpContext.Request.MapPath(link)).Ticks, 16);
            }
 
            link = link.TrimStart(new[] {'~', '/'});
            link = string.Format("{0}/{1}", “BASE_CDN_URL”, link);
 
            // returns the file URL in static domain
            return isDynamicResource ? link : string.Format("{0}?v={1}", link, cacheBreaker);
        }
 
        public static MvcHtmlString CdnContent
        (this UrlHelper url, MvcHtmlString mvcLink, bool isDynamicResource = false)
        {
            var context = mvcLink.ToHtmlString().ToLower();
            // match the scripts
            var linksMatches = ScriptRegex.Matches(context);
            var sb = new StringBuilder();
            foreach (Match linkMatch in linksMatches)
            {
                var link = linkMatch.Groups[1].Value;
                link = CdnContent(url, link, isDynamicResource);
                var script = string.Format
                ("<script type='text/javascript' src='{0}'></script>", link);
                sb.AppendLine(script);
            }
            // match the styles
            linksMatches = CssRegex.Matches(context);
            foreach (Match linkMatch in linksMatches)
            {
                var link = linkMatch.Groups[1].Value;
                link = CdnContent(url, link, isDynamicResource);
                var script = string.Format("<link href='{0}' 
                rel='stylesheet' type='text/css' />", link);
                sb.AppendLine(script);
            }
 
            return new MvcHtmlString(sb.ToString());
        }
    }
}

 HTML:

@(Url.CdnContent(Bundle.Css()
.Add("~/Content/base.css")
.Add("~/Content/CSS/Plugins/BootstrapDatepicker/daterangepicker-bs3.css")
.MvcRender("~/Content/CSS/min/combined_#.css")))

 JavaScript:

@(Url.CdnContent(Bundle.JavaScript()
.Add(@"~/Scripts/lib/jquery-2.0.2.min.js")
.Add(@"~/Scripts/lib/jquery.slimscroll.min.js")
.Add(@"~/Scripts/lib/jquery-ui-1.10.3.custom.min.js")
.Add(@"~/Scripts/lib/typeahead.min.js")
.Add(@"~/Scripts/lib/daterangepicker.js")
.Add(@"~/Scripts/lib/moment.min.js")
.MvcRender("~/Scripts/min/combined_#.js")))

 

 

参考连接：http://www.codeproject.com/Tips/986088/Optimize-your-WebApp-like-a-PRO-ASP-NET-MVC-Boiler

posted @ 2015-06-09 10:48  自然去留  阅读(260)  评论(0)    收藏  举报