是的,所以我花了几天时间更新我的NG2应用程序以使用angular-cli.起初这是一个非常令人沮丧的经历,然而,我真的看到了光明,享受着开发过程.显然,努力工作和思想已被纳入框架.
但我的申请很慢：
根据Pingdom,我的申请比互联网上所有其他网站的21％快.公平地说,这是一个开箱即用的构建,我相信我可以显着提高速度.
我的最后一个问题是：如何从根本上减少角度网站的大小？
应用程序：fairplay.poker,需要7秒才能加载(如果你住在纽约),所以我相信大多数人都会在它有机会加载之前继续前进.
显然,我需要开始一个从根本上提高应用程序速度的旅程,但我需要你的帮助！ (因为我不知道我在做什么:)
什么是标准练习,我在哪里开始排序？
进展：
作为建议,我将在这里更新它们.
1. @cyrix建议的生产就绪版本：ng build -prod
Zip文件下降超过一个兆字节,来自Pingdom的新统计数据与原始统计数据相比有了很大改进：
2.建议缩小图像尺寸.
有些图像比它们应该有的大一些,因此尺寸减小了.然而,这并不是一个重大改进,这些数据已经将网站提升到前73％的网站,加载时间略快一些.
3. @yurzui建议gzip压缩,所以我启用了这个.显然,它正在工作,总文件大小减少了一半以上(609字节),但这并没有显示在Pingdom上.不过,我注意到等级有所改善.
我使用this site来检查压缩,this site告诉我如何做到这一点,因为Cpanel在从管理启用时似乎不起作用.该网站似乎也是一个很好的gzip compression资源.
4 @Yuruzi建议实现浏览器缓存.所以我做到了！
真正有趣的是性能等级的改进,那就是摇滚！加载时间快一点,网站现在排在前74％.根据Yuruzi的建议,我使用this post作为指导.
5感谢#angularjs频道上的@ wafflej0ck.似乎我需要通过更改为“AddOutputFilterByType DEFLATE *”类型的压缩来改进GZip,如here所述.
这似乎增加了网站：
6有人建议使用AOT,因此我从this post开始.
我查看了大部分文档,我遇到了一个错误的世界,并决定将其留待以后,希望当AOT更稳定时.
我在GitHub上读到Angular-Cli预装了AOT并且上面的文章没有关系.我不确定这是多么真实但是我在编译代码时运行以下命令：ng build –prod –aot
7.调整htaccess文件中的mod_expires.c.
性能等级已显着提高到98％,加载时间现在不到一秒,网站比91％的测试网站快.
该文件目前看起来像这样：
ExpiresActive On
ExpiresDefault“访问加2天”
ExpiresByType image / x-icon“访问加1年”
ExpiresByType image / jpeg“access plus 1 year”
ExpiresByType image / jpg“access plus 1 year”
ExpiresByType image / png“access plus 1 year”
ExpiresByType image / gif“access plus 1 year”
ExpiresByType应用程序/ x-shockwave-flash“访问加1个月”
ExpiresByType text / css“access plus 1 month”
ExpiresByType文本/ javascript“访问加1个月”
ExpiresByType application / pdf“access plus 1 month”
ExpiresByType应用程序/ javascript“访问加1周”
ExpiresByType application / x-javascript“access plus 1 week”
ExpiresByType text / javascript“access plus 1 week”
ExpiresByType text / html“access plus 600 seconds”
ExpiresByType application / xhtml xml“access plus 600 seconds”
在这个时间点,我不禁想到我现在正在处理收益递减的问题.
>删除了css中包含的不需要的字体和未使用的图像.
加载时间减少,现场性能现在为100％
>慢DNS和SSL
我注意到大量的加载时间是由于DNS和SSL造成的.为了解决这个问题,我注册了一个免费的CloudFlare帐户,因为它们几乎到处都有节点,这必然会加速一些事情……
确实如此.可悲的是,来自PingDom的纽约主持人已被删除,但来自达拉斯的统计数据看起来非常有希望将负载时间减少到一秒钟之内！
其他好文章
>尽可能使用延迟加载模块(link)
>使用生产配置文件构建项目
>提前使用(AOT)编译(link)
>使用Angular-Universal,您可以将项目渲染的一部分移动到服务器端
