是动态加载 CSS 和 Javascript Hackish 还是 Good Practice？答案

【问题标题】：Is dynamically loading CSS and Javascript Hackish or Good Practice?是动态加载 CSS 和 Javascript Hackish 还是 Good Practice？
【发布时间】：2010-11-15 17:52:53
【问题描述】：

我不想引发一场火焰战争，但我很好奇人们的想法。

我能想到的动态加载的好处：

根据需要加载文件。快点加载时间
您可以创建与您的页面挂钩的小部件，只需链接到小部件和小部件加载所有它的文件

一些（可能的）否定：

在它之后加载头部的东西负载（我只是害怕做那？ :-P)
确保对代码进行评估。
Javascript 被关闭。

让我知道你的想法！

谢谢！马特

【问题讨论】：

标签： css dynamic

【解决方案1】：

它真的占用那么那么多带宽吗？我认为我开发的任何 Web 应用程序中最小的部分是 JavaScript / CSS。另外，浏览器无论如何都会缓存它，它只是真正重要的第一次点击。解决这样一个小问题没有必要增加复杂性。

编辑

根据我的评论，有一些关于如何使用 JavaScript 进行开发的非常好的文章。总体思路是以分层方式开发您的应用程序。 Javascript 仅位于顶部，但它并不是您网站运行的基础。禁用 Javascript 后一切正常。始终像用户没有启用 Javascript 一样进行开发（一些用户纯粹出于性能原因禁用它）。这是个好习惯。

【讨论】：

我的网站就像 98% 的 javascript 和 2% 的 CSS，HTML 哈哈。大量的 AJAX 和页面操作。
我应该说这就是我的前端的样子。
说实话，你应该小心使用 Javascript。总是就像用户没有启用 Javascript 一样进行开发。然后一旦它工作正常，添加Javascript。这称为渐进增强，带有优雅的降级。启用 Javascript，非常棒，但禁用了它，它应该仍然可以正常工作。
没错，但这完全取决于网站的要求。大多数网站都可以在没有 JavaScript 的情况下运行，但其中一些网站过于针对“现代互联网功能”，不值得让文本浏览器兼容。基本上：信息网站应该在没有 JavaScript 的情况下工作，交互式网站不一定必须这样做。尝试在禁用 JavaScript 的情况下在 youtube.com 上进行交互（搜索、观看电影等）。
是的。你们俩都提出了很好的观点。我制作的网站类型属于 Blixt 提到的类别，包括大量拖放、实时搜索和幻灯片。

【解决方案2】：

我通常将所有 CSS 压缩到一个文件中，并将使用页面所需的所有 JavaScript 压缩到另一个文件中（使用 YUICompressor。）然后我将这两个文件静态加载到 HTML 文档中。它会尽可能早地向您的用户显示内容（即使他们在等待时可能无法获得良好的加载指示），并且会使用更少的服务器资源。

如果我有用户交互后需要的 JavaScript/其他内容，我会动态加载。我并没有真正参与过许多受益于动态加载的项目，但这是我为我的 JavaScript 库所做的一个："Blixt's JavaScript Realm"（但它有如此多的动态加载的原因是因为该项目的全部目的是让它尽可能像 JavaScript...)

【讨论】：

【解决方案3】：

在一个非常大的流行网站上，您希望最大限度地减少 http 请求的总数，即使是很小的请求。亚马逊和 Ebay 竭尽全力做到这一点，甚至使用称为 css 图像精灵的技术将所有首页图像加载为一个巨大的 gif 或 jpeg，然后使用 CSS 将它们切片，所有这些都是为了节省每个 HTTP GET 请求的开销，避免的每个请求可以节省数百字节。

【讨论】：

如果你问我，几百字节不是减少请求数量的主要原因；每个单独的请求都会产生 CPU/内存开销，这比一些额外的带宽使用更有可能导致服务器停机。
那么您是在提倡将其全部加载并压缩吗？而不是根据需要加载包？