[AngularJS] New in Angular 1.3 - Performance Boost with debugInfoEnabled
Angular in with New 1.3 angularjs Boost performance
2023-09-14 09:00:55 时间
By default, Angular provides a lot of debug information on the DOM that's only necessary for tools like Protractor and Batarang. Angular 1.3 allows you to turn off the debug information to give your app a simple performance boost.
See: https://docs.angularjs.org/api/ng/provider/$compileProvider
More: https://docs.angularjs.org/guide/production#disabling-debug-data
<!DOCTYPE html> <html ng-app="app"> <head> <title></title> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"> <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.11/angular-ui-router.js"></script> <script src="app.js"></script> </head> <body> <script type="text/ng-template" id="templates/home.html"> <note message="Hello"></note> </script> <ui-view></ui-view> </body> </html>
angular.module("app", ["ui.router"]) .config(function config($stateProvider, $compileProvider) { $stateProvider.state("home", { url: "", templateUrl: "templates/home.html" }) $compileProvider.debugInfoEnabled(false); }) .directive("note", function note() { return { template: "<div>{{ note.message }} {{ note.person }}</div>", controller: "NoteController as note", bindToController: true, scope: { message: "@" } } }) .controller("NoteController", function NoteController() { var note = this; note.person = "John"; })
Without debug info:
If you want open the debug info again:
in console:
angular.reloadWithDebugInfo();
相关文章
- AngularJS的核心对象angular上的方法全面解析(AngularJS全局API)
- [Angular] Use Angular components in AngularJS applications with Angular Elements
- [Angular] Remove divs to Preserve Style and Layout with ng-container in Angular
- [Angular + Unit Testing] Mock HTTP Requests made with Angular’s HttpClient in Unit Tests
- [Angular] Handle HTTP Errors in Angular with HttpErrorResponse interface
- [Angular] USING ZONES IN ANGULAR FOR BETTER PERFORMANCE
- [Angular 2] Handle Reactive Async opreations in Service
- [Angular 2] Passing Observables into Components with Async Pipe
- [Angular 2] Build a select dropdown with *ngFor in Angular 2
- [AngularJS] Using Services in Angular Directives
- [Angular 14] Providers in Angular Route
- [Angular] Show a Loading Indicator for Lazy Routes in Angular
- [Angular] Remove divs to Preserve Style and Layout with ng-container in Angular
- [Angular + Unit Testing] Mock HTTP Requests made with Angular’s HttpClient in Unit Tests
- [Angular] Create a custom validator for template driven forms in Angular
- [Angular] Omit relative path by set up in tsconfig.json
- [Angular] Show a loading indicator in Angular using *ngIf/else, the as keyword and the async pipe
- [Angular Directive] Create a Template Storage Service in Angular 2
- [Angular Directive] Implement Structural Directive Data Binding with Context in Angular
- [Angular Directive] Combine HostBinding with Services in Angular 2 Directives
- [Angular 2] Share Template Content In Another Template With Content Projection <ng-content>
- [Angular 2] Rendering an Observable Date with the Async and Date Pipes
- [Angular 2] Using a Value from the Store in a Reducer
- [Angular 2] Filter items with a custom search Pipe in Angular 2
- [Whole Web] [AngularJS] Localize your AngularJS Application with angular-localization
- [AngularJS] Using Services in Angular Directives
- Angular的built-in指令