diff --git a/web/gui/src/main/webapp/app/fw/util/fn.js b/web/gui/src/main/webapp/app/fw/util/fn.js
index 3e2fb29..ad441cd 100644
--- a/web/gui/src/main/webapp/app/fw/util/fn.js
+++ b/web/gui/src/main/webapp/app/fw/util/fn.js
@@ -172,6 +172,32 @@
         return true;
     }
 
+    // returns true if the two objects have all the same properties
+    function sameObjProps(obj1, obj2) {
+        var key;
+        for (key in obj1) {
+            if (obj1.hasOwnProperty(key)) {
+                if (!(obj1[key] === obj2[key])) {
+                    return false;
+                }
+            }
+        }
+        return true;
+    }
+
+    // returns true if the array contains the object
+    // does NOT use strict object reference equality,
+        // instead checks each property individually for equality
+    function containsObj(arr, obj) {
+        var i;
+        for (i = 0; i < arr.length; i++) {
+            if (sameObjProps(arr[i], obj)) {
+                return true;
+            }
+        }
+        return false;
+    }
+
     // return the given string with the first character capitalized.
     function cap(s) {
         return s.toLowerCase().replace(/^[a-z]/, function (m) {
@@ -227,6 +253,8 @@
                 inArray: inArray,
                 removeFromArray: removeFromArray,
                 isEmptyObject: isEmptyObject,
+                sameObjProps: sameObjProps,
+                containsObj: containsObj,
                 cap: cap,
                 noPx: noPx,
                 noPxStyle: noPxStyle,
diff --git a/web/gui/src/main/webapp/app/fw/widget/table.css b/web/gui/src/main/webapp/app/fw/widget/table.css
index ae5ef03..846ce9e 100644
--- a/web/gui/src/main/webapp/app/fw/widget/table.css
+++ b/web/gui/src/main/webapp/app/fw/widget/table.css
@@ -63,6 +63,17 @@
     background-color: #304860;
 }
 
+/* highlighting */
+div.summary-list tr {
+    transition: background-color 500ms;
+}
+.light div.summary-list tr.data-change {
+    background-color: #FDFFDC;
+}
+.dark div.summary-list tr.data-change {
+    background-color: #5A5600;
+}
+
 div.summary-list td {
     padding: 6px;
     text-align: left;
diff --git a/web/gui/src/main/webapp/app/fw/widget/table.js b/web/gui/src/main/webapp/app/fw/widget/table.js
index 21baaa3..0b3191b 100644
--- a/web/gui/src/main/webapp/app/fw/widget/table.js
+++ b/web/gui/src/main/webapp/app/fw/widget/table.js
@@ -26,6 +26,7 @@
     // constants
     var tableIconTdSize = 33,
         pdg = 22,
+        flashTime = 2000,
         colWidth = 'col-width',
         tableIcon = 'table-icon',
         asc = 'asc',
@@ -208,7 +209,46 @@
                 scope.$on('$destroy', function () {
                     resetSort();
                 });
-            }
+            };
+        }])
+
+        .directive('onosFlashChanges', ['$log', '$parse', '$timeout',
+            function ($log, $parse, $timeout) {
+            return function (scope, element, attrs) {
+                var rowData = $parse(attrs.row)(scope),
+                    id = attrs.rowId,
+                    tr = d3.select(element[0]),
+                    multiRows = d3.selectAll('.multi-row'),
+                    promise;
+
+                scope.$watchCollection('changedData', function (newData) {
+                    angular.forEach(newData, function (item) {
+                        function classMultiRows(b) {
+                            if (!multiRows.empty()) {
+                                multiRows.each(function () {
+                                    d3.select(this).classed('data-change', b);
+                                });
+                            }
+                        }
+
+                        if (rowData[id] === item[id]) {
+                            tr.classed('data-change', true);
+                            classMultiRows(true);
+
+                            promise = $timeout(function () {
+                                tr.classed('data-change', false);
+                                classMultiRows(false);
+                            }, flashTime);
+                        }
+
+                    });
+                });
+                scope.$on('$destroy', function () {
+                    if (promise) {
+                        $timeout.cancel(promise);
+                    }
+                });
+            };
         }]);
 
 }());
diff --git a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
index 1196dee..7a38feb 100644
--- a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
+++ b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
@@ -30,7 +30,8 @@
     // {
     //    scope: $scope,     <- controller scope
     //    tag: 'device',     <- table identifier
-    //    selCb: selCb       <- row selection callback (optional)
+    //    selCb: selCb,      <- row selection callback (optional)
+    //    respCb: respCb,    <- websocket response callback (optional)
     //    query: params      <- query parameters in URL (optional)
     // }
     //          Note: selCb() is passed the row data model of the selected row,
@@ -45,31 +46,54 @@
             resp = o.tag + 'DataResponse',
             onSel = fs.isF(o.selCb),
             onResp = fs.isF(o.respCb),
+            oldTableData = [],
             promise;
 
         o.scope.tableData = [];
+        o.scope.changedData = [];
         o.scope.sortParams = {};
         o.scope.autoRefresh = true;
         o.scope.autoRefreshTip = 'Toggle auto refresh';
 
+        // === websocket functions --------------------
+        // response
         function respCb(data) {
             o.scope.tableData = data[root];
             onResp && onResp();
             o.scope.$apply();
-        }
 
+            // checks if data changed for row flashing
+            if (!angular.equals(o.scope.tableData, oldTableData)) {
+                o.scope.changedData = [];
+                // only flash the row if the data already exists
+                if (oldTableData.length) {
+                    angular.forEach(o.scope.tableData, function (item) {
+                        if (!fs.containsObj(oldTableData, item)) {
+                            o.scope.changedData.push(item);
+                        }
+                    });
+                }
+                angular.copy(o.scope.tableData, oldTableData);
+            }
+        }
+        handlers[resp] = respCb;
+        wss.bindHandlers(handlers);
+
+        // request
         function sortCb(params) {
             var p = angular.extend({}, params, o.query);
             wss.sendEvent(req, p);
         }
         o.scope.sortCallback = sortCb;
 
+        // === selecting a row functions ----------------
         function selCb($event, selRow) {
             o.scope.selId = (o.scope.selId === selRow.id) ? null : selRow.id;
             onSel && onSel($event, selRow);
         }
         o.scope.selectCallback = selCb;
 
+        // === autoRefresh functions ------------------
         function startRefresh() {
             promise = $interval(function () {
                 if (fs.debugOn('widget')) {
@@ -92,10 +116,7 @@
         }
         o.scope.toggleRefresh = toggleRefresh;
 
-        handlers[resp] = respCb;
-        wss.bindHandlers(handlers);
-
-        // Cleanup on destroyed scope
+        // === Cleanup on destroyed scope -----------------
         o.scope.$on('$destroy', function () {
             wss.unbindHandlers(handlers);
             stopRefresh();
diff --git a/web/gui/src/main/webapp/app/view/app/app.html b/web/gui/src/main/webapp/app/view/app/app.html
index 4d202bf..8f80a07 100644
--- a/web/gui/src/main/webapp/app/view/app/app.html
+++ b/web/gui/src/main/webapp/app/view/app/app.html
@@ -60,7 +60,8 @@
 
                 <tr ng-repeat="app in tableData track by $index"
                     ng-click="selectCallback($event, app)"
-                    ng-class="{selected: app.id === selId}">
+                    ng-class="{selected: app.id === selId}"
+                    onos-flash-changes row="{{app}}" row-id="id">
                     <td class="table-icon">
                         <div icon icon-id="{{app._iconid_state}}"></div>
                     </td>
diff --git a/web/gui/src/main/webapp/app/view/cluster/cluster.html b/web/gui/src/main/webapp/app/view/cluster/cluster.html
index a7c84bf..27bad4e 100644
--- a/web/gui/src/main/webapp/app/view/cluster/cluster.html
+++ b/web/gui/src/main/webapp/app/view/cluster/cluster.html
@@ -48,7 +48,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat="node in tableData track by $index">
+                <tr ng-repeat="node in tableData track by $index"
+                    onos-flash-changes row="{{node}}" row-id="id">
                     <td class="table-icon">
                         <div icon icon-id="{{node._iconid_state}}"></div>
                     </td>
diff --git a/web/gui/src/main/webapp/app/view/device/device.html b/web/gui/src/main/webapp/app/view/device/device.html
index 6f09fe4..c6f12b2 100644
--- a/web/gui/src/main/webapp/app/view/device/device.html
+++ b/web/gui/src/main/webapp/app/view/device/device.html
@@ -54,7 +54,8 @@
 
                 <tr ng-repeat="dev in tableData track by $index"
                     ng-click="selectCallback($event, dev)"
-                    ng-class="{selected: dev.id === selId}">
+                    ng-class="{selected: dev.id === selId}"
+                    onos-flash-changes row="{{dev}}" row-id="id">
                     <td class="table-icon">
                         <div icon icon-id="{{dev._iconid_available}}"></div>
                     </td>
diff --git a/web/gui/src/main/webapp/app/view/device/device.js b/web/gui/src/main/webapp/app/view/device/device.js
index ecfcc98..0e16dec 100644
--- a/web/gui/src/main/webapp/app/view/device/device.js
+++ b/web/gui/src/main/webapp/app/view/device/device.js
@@ -250,6 +250,7 @@
     .directive('deviceDetailsPanel', ['$rootScope', '$window',
     function ($rootScope, $window) {
         return function (scope) {
+            var unbindWatch;
 
             function heightCalc() {
                 pStartY = fs.noPxStyle(d3.select('.tabular-header'), 'height')
@@ -268,7 +269,7 @@
                 }
             });
 
-            $rootScope.$watchCollection(
+            unbindWatch = $rootScope.$watchCollection(
                 function () {
                     return {
                         h: $window.innerHeight,
@@ -283,6 +284,7 @@
             );
 
             scope.$on('$destroy', function () {
+                unbindWatch();
                 ps.destroyPanel(pName);
             });
         };
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.css b/web/gui/src/main/webapp/app/view/flow/flow.css
index 9aadffa..4aa9621 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.css
+++ b/web/gui/src/main/webapp/app/view/flow/flow.css
@@ -61,6 +61,24 @@
     background-color: #333;
 }
 
+/* highlighted color */
+.light #ov-flow tr:nth-child(6n + 1).data-change,
+.light #ov-flow tr:nth-child(6n + 2).data-change,
+.light #ov-flow tr:nth-child(6n + 3).data-change,
+.light #ov-flow tr:nth-child(6n + 4).data-change,
+.light #ov-flow tr:nth-child(6n + 5).data-change,
+.light #ov-flow tr:nth-child(6n).data-change {
+    background-color: #FDFFDC;
+}
+.dark #ov-flow tr:nth-child(6n + 1).data-change,
+.dark #ov-flow tr:nth-child(6n + 2).data-change,
+.dark #ov-flow tr:nth-child(6n + 3).data-change,
+.dark #ov-flow tr:nth-child(6n + 4).data-change,
+.dark #ov-flow tr:nth-child(6n + 5).data-change,
+.dark #ov-flow tr:nth-child(6n).data-change {
+    background-color: #5A5600;
+}
+
 #ov-flow td.selector,
 #ov-flow td.treatment {
     padding-left: 36px;
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.html b/web/gui/src/main/webapp/app/view/flow/flow.html
index 87109b6..3555d6b 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.html
+++ b/web/gui/src/main/webapp/app/view/flow/flow.html
@@ -55,7 +55,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat-start="flow in tableData track by $index">
+                <tr ng-repeat-start="flow in tableData track by $index"
+                    onos-flash-changes row="{{flow}}" row-id="id">
                     <td>{{flow.id}}</td>
                     <td>{{flow.appId}}</td>
                     <td>{{flow.groupId}}</td>
@@ -67,10 +68,10 @@
                     <td>{{flow.packets}}</td>
                     <td>{{flow.bytes}}</td>
                 </tr>
-                <tr>
+                <tr class="multi-row">
                     <td class="selector" colspan="10">{{flow.selector}}</td>
                 </tr>
-                <tr ng-repeat-end>
+                <tr class="multi-row" ng-repeat-end>
                     <td class="treatment" colspan="10">{{flow.treatment}}</td>
                 </tr>
             </table>
diff --git a/web/gui/src/main/webapp/app/view/group/group.css b/web/gui/src/main/webapp/app/view/group/group.css
index cf6b9af..42f1c31 100644
--- a/web/gui/src/main/webapp/app/view/group/group.css
+++ b/web/gui/src/main/webapp/app/view/group/group.css
@@ -57,6 +57,20 @@
     background-color: #333;
 }
 
+/* highlighted color */
+.light #ov-group tr:nth-child(4n + 1).data-change,
+.light #ov-group tr:nth-child(4n + 2).data-change,
+.light #ov-group tr:nth-child(4n + 3).data-change,
+.light #ov-group tr:nth-child(4n).data-change {
+    background-color: #FDFFDC;
+}
+.dark #ov-group tr:nth-child(4n + 1).data-change,
+.dark #ov-group tr:nth-child(4n + 2).data-change,
+.dark #ov-group tr:nth-child(4n + 3).data-change,
+.dark #ov-group tr:nth-child(4n).data-change {
+    background-color: #5A5600;
+}
+
 #ov-group td.buckets {
     padding-left: 36px;
     opacity: 0.65;
diff --git a/web/gui/src/main/webapp/app/view/group/group.html b/web/gui/src/main/webapp/app/view/group/group.html
index 13bde14..e47783c 100644
--- a/web/gui/src/main/webapp/app/view/group/group.html
+++ b/web/gui/src/main/webapp/app/view/group/group.html
@@ -67,7 +67,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat-start="group in tableData track by $index">
+                <tr ng-repeat-start="group in tableData track by $index"
+                    onos-flash-changes row="{{group}}" row-id="id">
                     <td>{{group.id}}</td>
                     <td>{{group.app_id}}</td>
                     <td>{{group.state}}</td>
@@ -75,7 +76,7 @@
                     <td>{{group.packets}}</td>
                     <td>{{group.bytes}}</td>
                 </tr>
-                <tr ng-repeat-end>
+                <tr class="multi-row" ng-repeat-end>
                     <td class="buckets" colspan="6"
                         ng-bind-html="group.buckets"></td>
                 </tr>
diff --git a/web/gui/src/main/webapp/app/view/host/host.html b/web/gui/src/main/webapp/app/view/host/host.html
index 7a32216..6298ebd 100644
--- a/web/gui/src/main/webapp/app/view/host/host.html
+++ b/web/gui/src/main/webapp/app/view/host/host.html
@@ -33,7 +33,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat="host in tableData track by $index">
+                <tr ng-repeat="host in tableData track by $index"
+                    onos-flash-changes row="{{host}}" row-id="id">
                     <td class="table-icon">
                         <div icon icon-id="{{host._iconid_type}}"></div>
                     </td>
diff --git a/web/gui/src/main/webapp/app/view/intent/intent.css b/web/gui/src/main/webapp/app/view/intent/intent.css
index 9f9923b..ed9cd48 100644
--- a/web/gui/src/main/webapp/app/view/intent/intent.css
+++ b/web/gui/src/main/webapp/app/view/intent/intent.css
@@ -47,6 +47,23 @@
     background-color: #333;
 }
 
+.light #ov-intent tr:nth-child(6n + 1).data-change,
+.light #ov-intent tr:nth-child(6n + 2).data-change,
+.light #ov-intent tr:nth-child(6n + 3).data-change,
+.light #ov-intent tr:nth-child(6n + 4).data-change,
+.light #ov-intent tr:nth-child(6n + 5).data-change,
+.light #ov-intent tr:nth-child(6n).data-change {
+    background-color: #FDFFDC;
+}
+.dark #ov-intent tr:nth-child(6n + 1).data-change,
+.dark #ov-intent tr:nth-child(6n + 2).data-change,
+.dark #ov-intent tr:nth-child(6n + 3).data-change,
+.dark #ov-intent tr:nth-child(6n + 4).data-change,
+.dark #ov-intent tr:nth-child(6n + 5).data-change,
+.dark #ov-intent tr:nth-child(6n).data-change {
+    background-color: #5A5600;
+}
+
 #ov-intent td.resources,
 #ov-intent td.details {
     padding-left: 36px;
diff --git a/web/gui/src/main/webapp/app/view/intent/intent.html b/web/gui/src/main/webapp/app/view/intent/intent.html
index 4fcb453..193267e 100644
--- a/web/gui/src/main/webapp/app/view/intent/intent.html
+++ b/web/gui/src/main/webapp/app/view/intent/intent.html
@@ -48,17 +48,18 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat-start="intent in tableData track by $index">
+                <tr ng-repeat-start="intent in tableData track by $index"
+                    onos-flash-changes row="{{intent}}" row-id="key">
                     <td>{{intent.appId}}</td>
                     <td>{{intent.key}}</td>
                     <td>{{intent.type}}</td>
                     <td>{{intent.priority}}</td>
                     <td>{{intent.state}}</td>
                 </tr>
-                <tr>
+                <tr class="multi-row">
                     <td class="resources" colspan="5">{{intent.resources}}</td>
                 </tr>
-                <tr ng-repeat-end>
+                <tr class="multi-row" ng-repeat-end>
                     <td class="details" colspan="5">{{intent.details}}</td>
                 </tr>
             </table>
diff --git a/web/gui/src/main/webapp/app/view/link/link.html b/web/gui/src/main/webapp/app/view/link/link.html
index fa8306f..69a4737 100644
--- a/web/gui/src/main/webapp/app/view/link/link.html
+++ b/web/gui/src/main/webapp/app/view/link/link.html
@@ -49,7 +49,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat="link in tableData track by $index">
+                <tr ng-repeat="link in tableData track by $index"
+                    onos-flash-changes row="{{link}}" row-id="one">
                     <td class="table-icon">
                         <div icon icon-id="{{link._iconid_state}}"></div>
                     </td>
diff --git a/web/gui/src/main/webapp/app/view/port/port.html b/web/gui/src/main/webapp/app/view/port/port.html
index 522abd5..d18d883 100644
--- a/web/gui/src/main/webapp/app/view/port/port.html
+++ b/web/gui/src/main/webapp/app/view/port/port.html
@@ -69,7 +69,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat="port in tableData track by $index">
+                <tr ng-repeat="port in tableData track by $index"
+                    onos-flash-changes row="{{port}}" row-id="id">
                     <td>{{port.id}}</td>
                     <td>{{port.pkt_rx}}</td>
                     <td>{{port.pkt_tx}}</td>
diff --git a/web/gui/src/main/webapp/app/view/settings/settings.html b/web/gui/src/main/webapp/app/view/settings/settings.html
index a10dd1c..b4226f4 100644
--- a/web/gui/src/main/webapp/app/view/settings/settings.html
+++ b/web/gui/src/main/webapp/app/view/settings/settings.html
@@ -33,7 +33,8 @@
                     </td>
                 </tr>
 
-                <tr ng-repeat="prop in tableData track by $index">
+                <tr ng-repeat="prop in tableData track by $index"
+                    onos-flash-changes row="{{prop}}" row-id="id">
                     <td>{{prop.component}}</td>
                     <td>{{prop.id}}</td>
                     <td>{{prop.type}}</td>