AngularJS Watcher 성능 문제

AngularJS에서 성능 문제가 있습니다. AngularJS Batarang에서 분석 한 결과 많은 관찰자와 함께 문제를 파악할 수있었습니다. 아래는 성능 최적화의 주범 인 코드 스 니펫입니다. 다음은 AngularJS Watcher 성능 문제

<table> 
    <tr> 
     <td style="padding:10px; width:20%">Response Summary: </td> 
     <td style="padding: 15px; width: 80%"> 
      <textarea class="form-control" rows="4" name="Response_Summary" ng-model="_sAResponses.sA_Response.sA_Response_Summary" disabled></textarea> 
     </td> 
    </tr> 
    <tr> 
     <td style="padding: 10px; width: 20%">Remarks: <label style="color: red;">*</label> </td> 
     <td style="padding: 15px; width: 80%"> <textarea class="form-control" rows="4" name="Response_Remark" ng-model="_sAResponses.validator_Comment" ng-disabled=" _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9 || _sAResponses.sA_Response.sA_Response_Status_Key == 19" style="text-align:left" required></textarea></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td style="padding:15px"><button type="button" class="btn btn-default" ng-click="toggleAllRemarks(_sAResponses)">All Validator Remarks</button></td> 
    </tr> 
    <tr> 
     <td colspan="2" style="padding:10px"> 
      <div> 
       <table style="width:100%" border="1"> 
        <tr> 
         <th colspan="3"> 
          <center>Supporting Artifacts Details</center> 
         </th> 
        </tr> 
        <tr> 
         <th>Note</th> 
         <th>Ticket number</th> 
         <th>File Name</th> 
        </tr> 
        <tr ng-repeat="evidences in ::_sAResponses.sA_Response.sA_Supporting_Evidences"> 
         <td>{{::evidences.sA_Supp_Evidence_Short_Note}}</td> 
         <td> 
          {{::evidences.sA_Supp_Evidence_Ticket_Number}} 
         </td> 
         <td><a href="{{ ::Url }}/Admin/api/SAValidateResponse?_Evidence_Key={{::evidences.sA_Supp_Evidence_Key}}">{{::evidences.evidence_file_name}}</a></td> 
        </tr> 
       </table> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td style="padding: 10px; width: 20%"> 
      <div ng-show="PageMode == 'SelfAssessmentValidateResponse'"> 
       Upload Validator Document: 
      </div> 
     </td> 
     <td style="padding: 15px; width: 80%"> 
      <div ng-show="PageMode == 'SelfAssessmentValidateResponse'"> 
       <input type="file" class="form-control" ng-disabled="_sAResponses.validator_file_name || _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9 " onchange="angular.element(this).scope().selectedFile(this)" /> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div style="padding: 10px; width: 20%"> 
       <div ng-show="_sAResponses.validator_file_name!=null"> 
        Validator Document: 
       </div> 
      </div> 
     </td> 
     <td> 
      <div ng-show="PageMode == 'SelfAssessmentValidateResponse'"> 
       <div ng-show="_sAResponses.validator_file_name!=null" style="padding-left:15px"> 
        <a href="{{ Url }}/Admin/api/SAValidateResponse?_Responsekey={{::_sAResponses.sA_Resp_Validator_Type_Map_Key}}">{{::_sAResponses.validator_file_name}}</a> 
        <span ng-show="(_sAResponses.member_Key == memberkey) && (_sAResponses.sA_Response.sA_Response_Status_Key == 10 || _sAResponses.sA_Response.sA_Response_Status_Key == 17 || _sAResponses.sA_Response.sA_Response_Status_Key == 18)"> 
                             <a ng-click="onDeleteValidatorUpload(_sAResponses)" href=""> 
                              <span class="glyphicon glyphicon-remove" aria-hidden="true" data-toggle="tooltip" data-placement="top" title="Delete"> 
                              </span> 
        </a> 
        </span> 
       </div> 
      </div> 
      <div ng-show="PageMode == 'ManageEscalation'"> 
       <div ng-show="_sAResponses.validator_file_name!=null" style="padding-left:15px"> 
        <a href="{{ ::Url }}/Admin/api/SAValidateResponse?_Responsekey={{::_sAResponses.sA_Resp_Validator_Type_Map_Key}}">{{::_sAResponses.validator_file_name}}</a> 
       </div> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td style="padding: 10px; width: 20%"> Status: <label style="color: red;">*</label></td> 
     <td style="padding: 15px; width: 80%"> 
      <div ng-show="PageMode == 'SelfAssessmentValidateResponse'"> 
       <select class="form-control" id="StatusDropDown1" name="StatusDropDown" ng-model="_sAResponses.validation_status_key" ng-disabled="_sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9 " ng-change="ddlstatuschange(_sAResponses.validation_status_key)" ng-options="s.sA_Response_Status_Key as s.sA_Response_Status_Name for s in _sAResponses.sA_Response.all_Sa_Response_Status"> 
                            <option value="">--Select Status--</option> 
                           </select> 
      </div> 
      <div ng-show="PageMode == 'ManageEscalation'"> 
       <select class="form-control" id="StatusDropDown2" name="StatusDropDown" ng-model="manageEscalateStatus"> 
                            <option value="">--Select Status--</option> 
                            <option value="11">Response Rejected</option> 
                            <option value="8">Revised Response Sought</option> 
                           </select> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="5" style="padding:10px"> 
      <center> 
       <div ng-show="PageMode == 'SelfAssessmentValidateResponse'"> 
        <div ng-show="_sAResponses.validation_status_key == undefined"> 
         <button type="button" class="btn btn-default" ng-disabled="!ResponseForm.Response_Remark.$valid ||!ResponseForm.StatusDropDown.$valid || _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9" ng-click="updateResponse(_sAResponses,_sAResponses.validation_status_key,'save')"> 
                              Save 
                             </button> 
        </div> 
        <div ng-show="_sAResponses.validation_status_key != undefined"> 
         <button type="button" class="btn btn-default" ng-disabled="!ResponseForm.Response_Remark.$valid || !ResponseForm.StatusDropDown.$valid || _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9" ng-click="updateResponse(_sAResponses,_sAResponses.validation_status_key,'validate')">Validate</button> 
        </div> 
       </div> 
       <div ng-show="PageMode == 'ManageEscalation'"> 
        <div ng-show="manageEscalateStatus == '' || manageEscalateStatus == undefined"> 
         <button type="button" class="btn btn-default" ng-disabled="!ResponseForm.Response_Remark.$valid ||!ResponseForm.StatusDropDown.$valid || _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9" ng-click="updateResponse(_sAResponses,manageEscalateStatus,'save')"> 
                              Save 
                             </button> 
        </div> 
        <div ng-show="manageEscalateStatus != undefined"> 
         <button type="button" class="btn btn-default" ng-show="manageEscalateStatus != ''" ng-disabled="!ResponseForm.Response_Remark.$valid ||!ResponseForm.StatusDropDown.$valid || _sAResponses.sA_Response.sA_Response_Status_Key == 8 || _sAResponses.sA_Response.sA_Response_Status_Key == 9" ng-click="updateResponse(_sAResponses,manageEscalateStatus,'validate')">Validate</button> 
        </div> 
       </div> 
      </center> 
     </td> 
    </tr> 
</table>

내가 위의 코드를 최적화 할 수있는 방법