我有一个应用程序，需要将其离线使用。对于通过JavaScript / jQuery在客户端构建动态内容而不是在服务器上执行此操作，我没有问题，但我卡在了基本页面布局上。
现在我的仅限服务器页面结构如下所示（我正在使用Coldfusion）：
<cfsavecontent variable="renderedResults">
<!--- Doctype --->
<cfinclude template="../templates/tmp_pagetop.cfm">
<cfoutput><head></cfoutput>
<cfif NOT isAjaxRequest()>
<!--- page header with all meta/js/css/icons... --->
<cfinclude template="../templates/tmp_pageheader.cfm">
</cfif>
<cfoutput>
<title>#variables.title# | #tx_select_title#</title>
</head>
<body>
// page
</body>
</html>
</cfoutput>
</cfsavecontent>
<!--- COMPRESS --->
<cfscript>
compressedHTML = reReplace(renderedResults, "\>\s+\<", "> <", "ALL");
compressedHTML = reReplace(compressedHTML, "\s{2,}", chr(13), "ALL");
compressedHTML = reReplace(compressedHTML, "\s{2,}", chr(09), "ALL");
variables.alredayBinary = "false";
</cfscript>
<!--- GZIP --->
<!--- SET HEADER --->
<!--- SEND BACK --->
我正在使用 Jquery Mobile，它会通过 Ajax 请求加载第一页的完整 head，然后在请求后续页面时不再使用头部。因此，我会检查页面是否是通过 Ajax 请求的，如果是，则在后续页面请求中跳过向客户端发送8k头部的步骤，因为 JQM 不会使用它们。
此外，我的头部模板包括很多条件内容，例如：
<cfif structKeyExists(cgi, "HTTP_USER_AGENT" ) AND findNoCase("facebook", cgi.http_user_agent) NEQ 0>
<cfoutput>
<meta property="og:title" content="#variables.title#"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="#variables.base#" />
<meta property="og:site_name" content="#variables.user_firma#"/>
<meta property="og:description" content="#variables.user_fbds#"/>
<meta property="fb:admins" content="#variables.user_fbadmin#" >
</cfoutput>
</cfif>
只有当Facebook请求页面时，我才包含Facebook Open Graph元素。这样，如果Google请求页面，则该页面会通过W3C验证。
现在的挑战是如何使其静态化并离线可用。
我已经考虑了一段时间，没有想出一个好的解决方案。如果我
- 提供完整页面=未通过W3C验证，每个页面请求在线用户都会面对8k的惩罚（是的，它被压缩了，但仍然存在）
- 不带头部提供页面=不太可行
- 提供两个版本的页面（一个用于在线使用，一个用于离线使用）=离线页面将被缓存，并且即使用户在线，他也将被“困”在那个缓存版本上。
- 只制作带有完整标头的第一页=从其他页面开始的用户将看到损坏的页面（没有标头）。主页也无法通过验证。
感谢您的回复！