我正在将一个巨大的角度1项目从1.3.x升级到1.6.x,因为我们需要最新版本的一些补丁.更新后,似乎整个应用程序已经显着放缓.我一直在查看迁移文档,但有什么可能导致重大减速吗?任何会导致此问题的错误代码或陷阱?我遇到的问题只是视觉变化,例如ng-show和ng-hide是缓慢而抽搐的.
谢谢!
编辑:
让我再说一点.我觉得这与摘要周期有关.例如,我是一个导航栏,其中一个图标将隐藏,另一个将在悬停时显示.
更新后我收到强制回流性能警告.此(重新计算样式)也来自角度动画的computeCssStyles函数(或者至少是它指向我的代码行).我也没有在我的代码中调用任何$ animate.这只是角度消化方法的产物吗?还有一些我在迁移文档中遗漏的关于可能对摘要进行更改的内容吗?
代码示例:在悬停时showDropdown从false更改为true,反之亦然.
<i> ng-show="! showDropdown" </i><i> ng-show="showDropdown" </i>
Run Code Online (Sandbox Code Playgroud)
编辑:短期修复,因为我没有在我的代码中的任何地方使用动画,但似乎是根据较新的角度摘要方法触发.我只是禁用动画作为部分短期修复.
$animate.enabled(false);
Run Code Online (Sandbox Code Playgroud) 我正在使用CSS Grid并在此处找到的codepen中进行了以下布局:https://codepen.io/alexg2195/pen/xLEeMd
我的问题是,在使用时,repeat(auto-fill, minmax(400px, 1fr));我最终得到的布局不仅仅是两列.
有没有办法强制两列,但仍然有相同的最小自动填充调整大小行为?
body {
margin: 40px;
}
.layout {
display: grid;
grid-gap: 10px;
grid-template-columns: 1fr 100px;
grid-template-areas: "main btn" "main .";
}
.btn {
grid-area: btn;
background-color: #444;
color: #ddd;
border-radius: 5px;
padding: 20px;
font-size: 150%;
}
.boxes {
grid-area: main;
display: grid;
grid-gap: 10px;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
}
.box {
background-color: #444;
color: #fff;
border-radius: 5px;
padding: 20px;
font-size: 150%;
}Run Code Online (Sandbox Code Playgroud)
<div class="layout">
<div class="boxes">
<div class="box a">A</div>
<div class="box …Run Code Online (Sandbox Code Playgroud)我在React Redux应用程序中使用重新选择时遇到有关性能的问题。
Reselect库用作记忆层,用于缓存为提高性能而进行的计算,但是如果您不需要执行任何计算/逻辑怎么办?
将选择器用于单个数据是否更高效?还是应该只使用标准的connect方法?
performance ×2
angularjs ×1
css ×1
css-grid ×1
css3 ×1
html ×1
javascript ×1
react-redux ×1
reactjs ×1
redux ×1
reselect ×1