ASP.NET 頁尾註冊 JavaScript 最佳實踐：RegisterStartupScript vs RegisterClientScriptInclude

兩大核心方法對比

場景一：引用外部 JS 文件（推薦 RegisterClientScriptInclude）

if (!Page.ClientScript.IsClientScriptIncludeRegistered("jquery"))
{
    Page.ClientScript.RegisterClientScriptInclude("jquery", "https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js");
}

優點：去重、瀏覽器並行下載、可緩存、不阻塞頁面渲染（配合 `defer`/`async` 需手工輸出）。

場景二：頁面級初始化腳本（推薦 RegisterStartupScript）

string initScript = @"
    $(function() {
        $('#grid').dataTable();
        $('#datepicker').datepicker({format: 'yyyy-mm-dd'});
    });
";
if (!Page.ClientScript.IsStartupScriptRegistered("pageInit"))
{
    // 最後參數 true：自動包裹 <script type="text/javascript">...</script>
    Page.ClientScript.RegisterStartupScript(typeof(string), "pageInit", initScript, true);
}

輸出位置：緊貼 `` 之前，確保 DOM 就緒、控件 ClientID 可用。

場景三：用 RegisterStartupScript 引用外部 JS（兼容舊代碼）

string scriptRef = "";
if (!Page.ClientScript.IsStartupScriptRegistered("customLib"))
{
    // 最後參數 false：不自動包裹，需自帶完整 script 標籤
    Page.ClientScript.RegisterStartupScript(typeof(string), "customLib", scriptRef, false);
}

輸出同樣在頁尾，適用於必須在頁面結構後加載的庫（如依賴某個 DOM 元素）。

進階：ScriptManager 時代

若頁面含 ``，改用 `ScriptManager.RegisterStartupScript` / `RegisterClientScriptInclude`，支援 UpdatePanel 部分回傳自動重新註冊。

最佳實踐清單

1. 庫文件走 CDN + RegisterClientScriptInclude，啟用瀏覽器緩存與並行下載。
2. 內聯初始化代碼走 RegisterStartupScript(true)，確保 DOM 就緒執行。
3. Key 命名規範：`lib:{name}` / `init:{page}:{feature}`，避免衝突。
4. 去重檢查：`IsClientScriptIncludeRegistered` / `IsStartupScriptRegistered` 防止重複輸出。
5. 避免在 Page_Load 直接 Response.Write 腳本：位置不可控、破壞 XHTML、難以去重。
6. 現代專案遷移：ASP.NET Core 使用 `` TagHelper、`