Css 角度ng类加载背景图像速度慢？

我正在使用ng click更改span标记的背景图像。第一次更改图像时，需要一两秒钟才能加载。但是在图像之间来回交替是完美的。这两个图像都是大约500字节，所以我不认为大小是一个问题

我正在为手机开发一款angular应用程序。在我的chrome移动仿真器中，图像可以完美加载。只有在移动设备上才会出现问题

    <div class="data_table" ng-click="collapsed = !collapsed">
        <table>
        <tr class="top_row">
              <td>
                <div>
                    Data
                </div>
              </td>
              <td>
                <span ng-class="!collapsed ? 'collapse_icon' : 'expand_icon'"></span>
              </td>
       </tr>
   </div>



.collapse_icon {
    font-size: 22px;
    line-height: 18px;
    font-weight: bold;
    float:left;
    width: 5%;
    color: #000;
    height: 22px;
    width: 22px;
    background-image: url(../images/collapse2.png);
    background-repeat: no-repeat;
    background-size: 22px 22px;
    padding-right: 2px;
}

.expand_icon {
    font-size: 22px;
    line-height: 18px;
    font-weight: bold;
    float:left;
    width: 5%;
    color: #000;
    height: 22px;
    width: 22px;
    background-image: url(../images/expand2.png);
    background-repeat: no-repeat;
    background-size: 22px 22px;
    padding-right: 2px;
}

资料
.折叠图标{
字体大小：22px；
线高：18px；
字体大小：粗体；
浮动：左；
宽度：5%；
颜色：#000；
高度：22px；
宽度：22px；
背景图像：url（../images/collapse2.png）；
背景重复：无重复；
背景尺寸：22px 22px；
右侧填充：2px；
}
.展开图标{
字体大小：22px；
线高：18px；
字体大小：粗体；
浮动：左；
宽度：5%；
颜色：#000；
高度：22px；
宽度：22px；
背景图像：url（../images/expand2.png）；
背景重复：无重复；
背景尺寸：22px 22px；
右侧填充：2px；
}

---

那么这只是一个移动问题还是我使用了错误的指令？

我认为这不是angular或指令本身的问题。有很多因素会影响性能。如果你相信你的设备可以顺利运行，你可以通过Chrome调试器中的Timeline来检查引擎盖下发生了什么

---

此外，您不应该依赖Chrome的emulator来获得性能，因为它并没有反映这一点。它对于html/css部分很有用。

问题在于ng模型绑定，而且您不应该依赖Chrome的emulator来获得性能，因为它没有反映这一点。这对于html/css部分很有用。

好的，谢谢。我希望这是代码，而不是另一个更难追踪的因素