ASP.NET MVC 腳本管理最佳實踐：輕量級 HtmlHelper 擴充方案

ASP.NET MVC 移除 WebForms 的 ScriptManager 後，開發者需自行解決腳本重複引用、載入順序、衝突等問題。本文提出一個極簡的 HtmlHelper 擴充方案，透過 HttpContext.Items 去重，在 Master Page `` 統一輸出，避免傳統字典管理的複雜度。

核心程式碼：ScriptManagementExtension

public static class ScriptManagementExtension
{
    private const string ScriptFormat = "\t<script src=\"{0}\" type=\"text/javascript\"></script>";
    private const string CSSFormat = "\t<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\"></link>";

    private static string IncludeHeader(HtmlHelper helper, string key, string path, string format)
    {
        var context = helper.ViewContext.HttpContext;
        if (!context.Items.Contains(key))
        {
            var url = new UrlHelper(helper.ViewContext.RequestContext, helper.RouteCollection);
            context.Items[key] = true;
            return string.Format(format, url.Content(path));
        }
        return null;
    }

    public static string IncludeScript(this HtmlHelper helper, string path)
        => IncludeScript(helper, path.ToLower(), path);

    public static string IncludeScript(this HtmlHelper helper, string key, string path)
        => IncludeHeader(helper, key, path, ScriptFormat);

    public static string IncludeCSS(this HtmlHelper helper, string path)
        => IncludeCSS(helper, path.ToLower(), path);

    public static string IncludeCSS(this HtmlHelper helper, string key, string path)
        => IncludeHeader(helper, key, path, CSSFormat);
}

使用方式

在 Master Page `` 區域放置佔位符：

<asp:ContentPlaceHolder ID="ScriptContent" runat="server" />

各 View 中直接呼叫：

<%= Html.IncludeCSS("https://www.cnblogs.com/Content/Site.css") %>
<%= Html.IncludeCSS("jQuery_Theme", Html.GetThemePath()) %>
<%= Html.IncludeScript("https://www.cnblogs.com/Scripts/jquery-1.3.2.min.js")%>
...

設計優勢

• 零配置：無需註冊服務、修改 web.config、建立基底類別。
• 自動去重：同一請求內相同 key 僅輸出一次，解決 Partial View 重複引用問題。
• 輸出在 Head：符合 HTML 標準，瀏覽器可並行下載 CSS/JS，避免 body 底部阻塞渲染。
• 支援 CDN 與相對路徑：透過 UrlHelper.Content 自動解析 ~ 路徑。

對比現有方案

遺留疑問

為何 Microsoft 至今未內建標準腳本管理解決方案？或是已存在但未被廣泛發現？期待社群補充。