角JS缩放和放大器;性能 [英] Angular JS Scaling & Performance

查看:173
本文介绍了角JS缩放和放大器;性能的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我们正在冲击我们对性能问题与头我们正在为一家银行的角度应用程序。

We are pounding our heads against performance issues with an Angular app we are building for a bank.

不幸的是,它是一种违反合同显示code的片段。无论如何,我可以介绍一些主要问题回事,我希望最佳实践可推荐。

Unfortunately, it is a breach of contract to show snippets of the code. Regardless, I can describe some of the main issues going on, and I am hoping that best practice can be recommended.

应用程序结构:


  • 从本质上讲,一个巨大的多形式的页面。

  • 每个窗体是它自己的部分,与嵌套控制器和谐音约为3级。

  • 同样的形式NG-重复了JSON对象的集合。

  • 每个形式被绑定到对象/模型,它是重复了。

  • 我们都应该从页面上1-200形式的任何地方支持。

如果你看看时间轴。我们花费了大量时间在jQuery的解析HTML的方法,重新计算的jQuery麦粒肿法,气相色谱事件(垃圾收集)。我想尽量减少这些应加快了一点东西。他们是角生命周期的各个部分,但可能有更好的方法来避免。下面是探查一些截图:

If you take a look at the timeline. We are spending a great deal of time in the jQuery parse html method, jQuery recalculate stye method, the GC Event (Garbage Collection). I imagine minimizing these should speed things up a bit. They are all a part of the Angular lifecycle, but there may be better ways to avoid them. Here are some screenshots of the profiler:


最后,应用程序是为低迷的重复表格的数量必须高于5.每个形式是相对无关的其他人。我们试图不给形式之间观看任何共享属性。

Ultimately, the app is sluggish as the number of repeated forms goes above 5. Each form is relatively unrelated to the others. We have tried not to watch any shared properties between the forms.

推荐答案

您需要,以遏制与棱角分明的性能问题,创建自定义指令。不像烬角度与所有的花里胡哨的开启和它给你调下来。下面是我创建帮助你一些指令。不要在你的应用程序的所有数据需要绑定双向数据,因此你可以在需要的页面放弃手表前pressions节省宝贵的CPU资源。所有这些指令将数据绑定一次,独自离开了。

You need to create custom directives in order to curb the performance issues with angular. Unlike ember angular comes with all the bells and whistles turned on and it's up to you to tone it down. Here are a few directives I've created to help you out. Not all data in your app needs to be two way data bound and as a result you can save valuable cpu power by forgoing watch expressions in the page where needed. All of these directives bind data one time and leave it alone.

https://gist.github.com/btm1/6802599

https://gist.github.com/btm1/6802312

https://gist.github.com/btm1/6746150

上面的一个关于有巨大的性能NG-重复谈判的答案打,所以我给你设置重复一次性的数据绑定重复指令:)

One of the answers above talks about ng-repeat having huge performance hits so I give you "set-repeat" a one time data binding repeat directive :)

这篇关于角JS缩放和放大器;性能的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆