2016-04-12 8 views
2

Ich bin neu in Angular, JavaScript und Typoskript und mit Angular2 Tutorial spiele bei https://angular.io/docs/js/latest/quickstart.htmlangular2 Typoskript Leistung

Typoskript zusammengestellt app.component.js

System.register(['angular2/core'], function(exports_1, context_1) { 
    "use strict"; 
    var __moduleName = context_1 && context_1.id; 
    var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { 
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; 
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); 
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; 
     return c > 3 && r && Object.defineProperty(target, key, r), r; 
    }; 
    var __metadata = (this && this.__metadata) || function (k, v) { 
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v); 
    }; 
    var core_1; 
    var AppComponent; 
    return { 
     setters:[ 
      function (core_1_1) { 
       core_1 = core_1_1; 
      }], 
     execute: function() { 
      AppComponent = (function() { 
       function AppComponent() { 
       } 
       AppComponent = __decorate([ 
        core_1.Component({ 
         selector: 'my-app', 
         template: '<h1>My First Angular 2 App</h1>' 
        }), 
        __metadata('design:paramtypes', []) 
       ], AppComponent); 
       return AppComponent; 
      }()); 
      exports_1("AppComponent", AppComponent); 
     } 
    } 
}); 

Das JavaScript-Beispiel app.component. js

(function(app) { 
    app.AppComponent = 
    ng.core.Component({ 
     selector: 'my-app', 
     template: '<h1>My First Angular 2 App</h1>' 
    }) 
    .Class({ 
     constructor: function() {} 
    }); 
})(window.app || (window.app = {})); 

Für mich ist die JavaScript-Version von Angular2 viel kürzer und einfacher zu verstehen. Die kompilierte eine von Typoskript ist ein bisschen schwer zu schlucken, wie core_1_1 als Parameter übergeben, aber ich sehe nicht, wo ich es in passieren kann.

Also meine Fragen sind wie folgt

  1. Will Typoskript Version läuft langsamer als die JavaScript-Version, da in der Regel desto mehr Abstraktionsschichten langsamer sind?

  2. Ist TypScript der empfohlene Weg in die Zukunft zu gehen, da das Tutorial in JavaScript nur als Schnellstart verfügbar ist?

  3. Wenn ich TypeScript für die Codierung von Angular zu Modulen verwende, muss ich viel kompilierten JavaScript-Code außer Fehler/Debugging-Zweck kümmern?

Danke,

+0

Liegt das daran, dass die JS-Version nach ES2015 kompiliert wird, während TypeScript auf ES5 kompiliert? –

+0

nein, die Klasse in der Standard-js ist Teil der eckigen Kernbibliothek, nicht die es2015-Klasse. Wenn Sie sich für die perf des transpilled Codes interessieren, werfen Sie einen Blick auf https://benchmarkjs.com/ – atmd

Antwort

2

Typoskript nicht wirklich für extreme Lesbarkeit nach der Kompilierung konzipiert und maschinen kompilierten Code wird immer schwieriger zu lesen als gut geschriebene-by-a-human-Code (bis AI nimmt unsere Jobs). Also, um Ihre Fragen zu beantworten:

  • Ich bin mir keiner Leistungstests bewusst, die große Geschwindigkeit Vorteile oder Nachteile zeigen, wie auch immer. Heutzutage sind geringe Unterschiede in der JS-Syntax ohnehin kein Flaschenhals. Ineffiziente Algorithmen, konstante Repaints, langsames Netzwerk usw. sind viel auffälliger.

  • Das Angular-Team scheint sich für TypeScript stark zu machen. TBD, wenn das aufgeht, aber sie haben die Ressourcen, so lange sie wollen.

  • Nicht besonders. Der Hauptvorteil von TypeScript besteht darin, dass Sie mit Ihren Datentypen nicht wie in regulären JS-Programmen arbeiten können. In der Theorie führt dies zu wartbarem Code mit weniger Fehlern, die leichter zu debuggen sind. Letztendlich wird es auf Ihre bevorzugten Methoden zum Debuggen ankommen, aber Fehlermeldungen sind mit TypeScript nicht kryptischer.

  • Verwandte Themen