Mesure le chargement de la page de l'application angulaire

Question

Salut Tous J'ai essayé le var loadTime = window.performance.timing.domContentLoadedEventEnd- window.performance.timing.navigationStart; mais la valeur semble être beaucoup plus petite que le temps réel nécessaire pour charger la page. Idéalement, je veux avoir un chronomètre qui arrête de compter lorsque la page est complètement chargée. Toute suggestion?

Answer 1

Je ne dirai pas que cette méthode n'est pas sans défauts, mais si vous mesurez le chargement de données, voici une méthode que vous pouvez utiliser pour obtenir un compteur de chargement.

1. Créez un bool pour évaluer, isLoading. Le hisser à true. Créez votre int, loadTime.
2. Utilisez un SetInterval pour incrémenter l'int
3. charge des données
4. après avoir traité les données, définir la condition isLoading-false.

Exemple:

https://plnkr.co/edit/ARVpFd9NmlFNURlyS9SZ

 app.controller("myCtrl", function($scope, $http) { 
     $scope.isLoading = true; 
     $scope.loadTime = 0; 
     $scope.msg = ''; 

     var tmr = setInterval(function() { 
      if(!$scope.isLoading || $scope.isLoading === false) { 
      clearInterval(tmr); 
      } 
      $scope.loadTime += 0.01; 
     }, 100); 
     $http.get('https://unsplash.com') 
      .then(function(res) { 
      $scope.msg = 'Data is loaded'; 
      $scope.isLoading = false; 
      });