Angular路由页面的优化问题?

<!DOCTYPE html>
<html ng-app="myRouteApp">
<head>
    <title></title>
    <script src="jquery-1.11.2.min.js"></script>
    <script src="angular.min.js"></script>
      <script src="angular-route.min.js"></script>
</head>
<body>
    <div>
    <ul>
        <li><a href="#page1">go page 1</a></li>
        <li><a href="#page2">go page 2</a></li>
        <li><a href="#page3">go page 3</a></li>
    </ul>
</div>
<div ng-view></div>
<script type="text/javascript">
    angular.module("myRouteApp", ["ngRoute"])
    .config(['$routeProvider', function ($routeProvider) {
        $routeProvider
            .when("/",      {templateUrl: "page1.php"})
            .when("/page1", {templateUrl: "page1.php"})
            .when("/page2", {templateUrl: "page2.html"})
            .when("/page2", {templateUrl: "page2.html"});
    }]);
</script>
</body>
</html>

页面结构是这样,刚刚载入页面的时候,会默认载入page1,其他页面会被缓存,页面少的时候没问题,但是页面达到了好几十个的时候,页面切换的时候会有点卡顿,是不是缓存太多页面导致的卡顿?请问能否优化呢?

谢谢~

阅读 3.9k
4 个回答

为了不影响用户体验,可以在页面切换的时候加点“正在加载”动画吧。

关注,我也想知道如何解决这个问题

关注关注,我也想知道如何解决这个问题

推荐问题