diff --git a/src/views/addons.html b/src/views/addons.html
index 7c0d2effd..7f05ff20f 100644
--- a/src/views/addons.html
+++ b/src/views/addons.html
@@ -43,7 +43,8 @@
               <tbody>
                 <tr ng-repeat="addon in addons">
                   <td>
-                    <i class="fa fa-circle" uib-tooltip="{{ addon.state }}" ng-style="{ color: addon.state === 'active' ? '#27CE65' : '#d9534f' }"></i>
+                    <i class="fa fa-circle" uib-tooltip="{{ addon.status }}" ng-style="{ color: addon.status === 'active' ? '#27CE65' : '#d9534f' }" ng-show="addon.status"></i>
+                    <i class="fa fa-circle-notch fa-spin" ng-hide="addon.status"></i>
                   </td>
                   <td class="elide-table-cell">
                     {{ addon.name }}
@@ -53,8 +54,8 @@
                   </td>
                   <td class="text-right no-wrap" style="vertical-align: bottom">
                     <a class="btn btn-xs btn-default" ng-href="{{ '/logs.html?id=' + addon.name }}" target="_blank" uib-tooltip="Logs"><i class="fa fa-file-alt"></i></a>
-                    <button class="btn btn-xs btn-success" ng-click="startAddon(addon.name)" uib-tooltip="Start" ng-show="addon.state === 'inactive'"><i class="fa fa-play"></i></button>
-                    <button class="btn btn-xs btn-danger" ng-click="stopAddon(addon.name)" uib-tooltip="Stop" ng-show="addon.state === 'active'"><i class="fa fa-stop"></i></button>
+                    <button class="btn btn-xs btn-success" ng-click="startAddon(addon.name)" uib-tooltip="Start" ng-show="addon.status === 'inactive'"><i class="fa fa-play"></i></button>
+                    <button class="btn btn-xs btn-danger" ng-click="stopAddon(addon.name)" uib-tooltip="Stop" ng-show="addon.status === 'active'"><i class="fa fa-stop"></i></button>
                   </td>
                 </tr>
               </tbody>
diff --git a/src/views/addons.js b/src/views/addons.js
index 98b0b80c8..046006d97 100644
--- a/src/views/addons.js
+++ b/src/views/addons.js
@@ -6,14 +6,13 @@ angular.module('Application').controller('AddonsController', ['$scope', '$locati
     Client.onReady(function () { if (!Client.getUserInfo().admin) $location.path('/'); });
 
     $scope.ready = false;
-    $scope.addons = [];
+    $scope.addons = {};
 
-    function refresh() {
-        Client.getAddons(function (error, result) {
+    function refresh(addonName) {
+        Client.getAddon(addonName, function (error, result) {
             if (error) return Client.error(error);
 
-            $scope.addons = result.map(function (a) { return { name: a, state: 'active' }; });
-            $scope.ready = true;
+            $scope.addons[addonName] = result;
         });
     }
 
@@ -21,7 +20,7 @@ angular.module('Application').controller('AddonsController', ['$scope', '$locati
         Client.startAddon(addonName, function (error) {
             if (error) return Client.error(error);
 
-            refresh();
+            refresh(addonName);
         });
     };
 
@@ -29,9 +28,22 @@ angular.module('Application').controller('AddonsController', ['$scope', '$locati
         Client.stopAddon(addonName, function (error) {
             if (error) return Client.error(error);
 
-            refresh();
+            refresh(addonName);
         });
     };
 
-    Client.onReady(refresh);
+    Client.onReady(function () {
+        Client.getAddons(function (error, result) {
+            if (error) return Client.error(error);
+
+            result.forEach(function (a) {
+                $scope.addons[a] = { name: a };
+
+                // just kick off the status fetching
+                refresh(a);
+            });
+
+            $scope.ready = true;
+        });
+    });
 }]);