将javascript与php混合时的性能和缓存

在阅读了大量关于这个主题的文章后，我意识到许多开发人员将javascript和php混合在同一个文件中（通过添加.php扩展名或使用其他方式）

另一方面，如果我选择将javascript与php分离并将其存储在外部可缓存的静态文件中，我会获得一些性能优势，但我还需要找到创造性的方法将服务器端数据传递给javascript

例如，因为我不能在.js文件中使用php foreach循环，所以我需要使用json_encode将php数组转换为json对象。在其他情况下，我需要在原始php文件中声明gloabljavascript变量，以便在外部js文件中使用它们。 由于服务器端处理被认为比javascript更快，因此转换为js数组和使用全局变量也可能是个坏主意

---

底线是我正在努力理解这里的权衡。通过避免全局js变量和多节点js数组，启用js文件缓存或保持代码更干净，哪个对性能影响更大？

您是在谈论服务器还是浏览器的性能

我个人的观点是，如果要在让服务器变慢还是让浏览器变慢之间做出选择，你应该总是选择让浏览器变慢

通常，“慢”的意思是“需要100毫秒”左右，这在单个浏览器上是不明显的，但是如果你有几百个对服务器的请求，它们都因此而延迟，那么效果是累积的，响应就会变得缓慢。非常明显

---

让浏览器承担责任。

您是在谈论服务器的性能还是浏览器的性能

我个人的观点是，如果要在让服务器变慢还是让浏览器变慢之间做出选择，你应该总是选择让浏览器变慢

通常，“慢”的意思是“需要100毫秒”左右，这在单个浏览器上是不明显的，但是如果你有几百个对服务器的请求，它们都因此而延迟，那么效果是累积的，响应就会变得缓慢。非常明显

---

让浏览器承担责任。

我认为这取决于你想做什么。我个人的观点是，阻止动态JavaScript被缓存有点痛苦

静态JS文件需要包含函数而不包含动态数据。HTML页面可以包含动态数据。在脚本块中（您可以在其中使用PHP foreach），或者通过将数据放入DOM中，JavaScript可以读取数据，数据可以是可见的（在表中），也可以是不可见的（例如在注释中），这取决于您的数据是否可呈现

您也可以使用AJAX获取动态数据，但这将是一个额外的请求，就像包含数据的外部JS文件一样

---

正如Kae所说，在客户端添加额外负载将有利于服务器的可扩展性（您可以同时为多少用户提供服务）。

我认为这取决于您的尝试。我个人的观点是，阻止动态JavaScript被缓存有点痛苦

静态JS文件需要包含函数而不包含动态数据。HTML页面可以包含动态数据。在脚本块中（您可以在其中使用PHP foreach），或者通过将数据放入DOM中，JavaScript可以读取数据，数据可以是可见的（在表中），也可以是不可见的（例如在注释中），这取决于您的数据是否可呈现

您也可以使用AJAX获取动态数据，但这将是一个额外的请求，就像包含数据的外部JS文件一样

正如Kae所说，在客户机上添加额外负载将有利于服务器的可扩展性（您可以同时为多少用户提供服务）。

数据：

如果动态数据量不是太大且不断变化（不能被浏览器缓存），我建议将其添加到HTML的头部。为了防止它污染全局名称空间，可以使用闭包或名称空间（对象）来包含所有相关变量。就性能而言，我不认为在这种情况下，将数据循环成JS友好的格式或在服务器上处理到最精细的细节之间会有太大的区别（JS变得惊人地快）

当数据量很大（100+kbs到兆字节）时，事情就复杂了一点。如果数据非常稳定且可缓存，则应该生成一个外部数据文件（不是一个实际的新文件，而是一个唯一的URL），然后可以将其包括在内。在名称中使用时间戳或正确设置缓存头将使您能够节省服务器端（生成JS友好输出）和客户端（下载数据）的时间，并且仍然提供最新数据

如果你有很多数据，但数据是不断变化的，我仍然会使用由PHP生成的外部JS文件，但是你必须格外小心地禁用浏览器缓存，这使得你不断变化的数据非常稳定。您还可以进行动态加载，通过JS请求并行和按需提取数据的不同部分

代码：

代码的功能部分应遵循前面的说明： 现在来看看JS应该内联到HTML还是分开。这在很大程度上取决于代码的长度和可重用性。如果只是由PHP生成的20行JS，其中10行是数组等，那么将代码留在HTML中会更有意义，因为HTTP请求（所有资源交付给客户端的方式）非常昂贵，请求一个小文件并不一定是个好主意

然而，如果你有一个大一点的文件，有很多功能等等（10s的kbs），那么使用

<script type="text/javascript">
a(param1, param2, param3)
</script>