如何使angularjs网站加载更快

Question

**我正在开发一个网站，其中前端是用Angularjs **

制作的

网站名称为http://limokit.com/limolog，但问题是，在浏览器上打开网站页面至少需要30秒。如何减少加载时间？

我们使用ngRoute来更改状态，但是没有得到我们想要实现的结果。我们还将所有html和js转换为缩小的，但它也没有首次影响加载问题。

Answer 1

乍一看，您似乎正在单独加载单个js和css文件。这可以大大减慢页面的加载速度，特别是在较慢的连接上。这里要做的常见优化是将所有js文件和css文件组合在一起，并在生产中提供一个单独的js和一个css文件。我不知道你用什么来提供JS / CSS文件，但我使用compressor来表示Django。

此外，为了进一步调试此问题，如果您在Chrome检查器中查看网页在页面加载时所执行的网络请求，则会有所帮助。您可以通过查看页面加载时瓶颈的位置来收集大量信息。

Answer 2

在您的网站中，您有63个请求，大小约为3MB（未缓存）。

正如其他答案所述，所有内容都在捆绑中。例如。 vendor.bundle.js，bundle.js和bundle.css，并缩小这些包。

我会使用webpack或gulp进行捆绑。

对于调试，您可以查看Firefox右下方的浏览器控制台网络选项卡，您可以看到加载时间统计信息的链接，还可以获得有关缓存的信息。

以下屏幕截图显示了您网站的统计信息（左侧是缓存，右侧未缓存）。

Answer 3

放弃所有框架和库，例如Angular和Jquery，并使用JSvanilla。普通的javascript运行起来要快得多（根据我阅读的许多资源，它的运行速度约为160倍。根据我的经验，我也知道这一点）。 框架使您的网站爬行。