Angular10.1の新機能

Angular10のフォローアップポイントリリースであるAngular10.1.0が9月2日にリリースされ、新しいメッセージ抽出ツールとともにコンパイラとルーターのパフォーマンスが向上しました。 

Angular 10は、6月24日に製品リリースとして一般提供されました。Googleが開発したTypeScriptベースのフレームワークへのメジャーアップグレードでは、新機能よりも品質、ツール、エコシステムの改善に重点が置かれています。

Angular 10は、以前のバージョンのAngularよりも小さくなっています。新機能には、Angular MaterialUIコンポーネントライブラリの新しい日付範囲ピッカーとCommonJSインポートの警告が含まれます。CommonJSのインポート警告は、CommonJSにパッケージ化された依存関係によってアプリケーションが大きくなり、速度が低下する可能性がある場合に開発者に警告し、開発者がECMAScriptモジュールバンドルを置き換えることができるようにします。

で新しいワークスペースを作成する際に加えて、オプションの厳しい設定がより厳密プロジェクトのセットアップを提供ng newを通じて、ng new --strict。このフラグを有効にすると、新しいプロジェクトが新しい設定で初期化され、保守性が向上し、バグをキャッチし、CLIがアプリで高度な最適化を実行できるようになります。

Angular10をダウンロードする場所

Angular10の一般リリースはGitHubにあります。現在のAngularインストールを更新するには、次のコマンドを実行できます。

ng update @ angular / cli @ angular / core

Angular10.1.0の新機能

GitHubで入手可能なAngular10.1.0リリースには、次の新機能と改善点が含まれています。 

  • コンパイラCLIのパフォーマンスを向上させるために、Angular 10.1には、増分プログラムの再利用に影響を与えるパフォーマンスの低下に対する修正があります。
  • ルーターのパフォーマンスについては、prioritizedGuardValueオペレーターはCanLoadガードを最適化するために適用されています。
  • ProgramBasedEntryPointFinderEntryPointManifest可能な場合は再利用してエントリポイントの依存関係をロードします。これにより、ngccを呼び出すたびにエントリポイントの依存関係を再度解析する必要がなくなります。
  • 新しいメッセージ抽出ツールがサポートされ、最終的にCLIに統合されます。
  • Bazelビルドツールの場合、LinkabablePackageInfoがng-moduleルールに追加され、リンカーng_moduleがNode.jsランタイムアクションでターゲットを適切にリンクできるようになります。
  • 静的評価エラーに対して生成された診断に、より多くの洞察が追加されます。
  • 絶対URLHTTPサポートのオプションが追加されました。
  • TypeScript4.0のサポートがコンパイラに追加されました。
  • canparse() 診断が公開されます。
  • ルーター、フォーム、コンパイラCLI、およびngccコンパイラ互換性ツールのパフォーマンスが向上しました。
  • ライフサイクルフックの変更は、ブートストラップの前であればいつでも行うことができます。
  • Angularのコア、ルーター、およびその他の部分に対して、多数の大きな修正が提供されています。

Angular10の新機能

Angular10の主な機能は次のとおりです。

  • ヘルパー関数を含むTypeScriptのランタイムライブラリであるTSlibがTSlib2.0に更新されました。TypeScript用のTSLint静的分析ツールがTSLint6に更新されました。
  • 実際のngtscコンパイラをラップするコンパイラインターフェイスが追加されました。言語サービス固有のコンパイラは、プロジェクトインターフェイスを使用して複数のタイプチェックファイルを管理し、必要に応じてScriptinfoを作成します。
  • 新しいプロジェクトのブラウザー構成が更新され、古くて使用頻度の低いブラウザーが除外されました。Internet Explorer 9、Internet Explorer 10、およびInternet ExplorerMobileのサポートは廃止されました。
  • Angular Package FormatにはESM5またはFESM5バンドルが含まれなくなり、実行時yarnまたはnpm installAngularパッケージとライブラリのダウンロードとインストールの時間を節約できます。
  • コンパイラーでは、プロパティの読み取りとメソッド呼び出しに名前スパンが追加されました。
  • EntryPointFindertsjconfig.jsonファイルで指定されたプログラムのインポートからシードできるプログラムベースのエントリポイントファインダーが追加されました。これはDirectoryWalkerEntryPointFinder、アクティブなプログラムがインストールされたエントリポイントのごく一部しかインポートしない場合よりも高速であると予想されます。 
  • &値が疑わしいこととパフォーマンスの問題があるため、オートコンプリートはなどのHTMLエンティティから削除されています。
  • 明示的なマッピングは、クロージャからdevmodeファイルに公開されています。この機能は、本番ビルドの入力を同等のdevmodeに変換する必要がある開発ツールを対象としています。
  • 重大な変更で、genericがに必須になりましたModuleWithProviders。ModuleWithProvidersパターンがIvyコンパイルおよびレンダリングパイプラインで機能するには、ジェネリック型パラメーターが必要ですが、このコミットの前に、ViewEngineではジェネリック型を省略できました。開発者がModuleWithProvidersジェネリック型なしで使用している場合、バージョン10の移行でコードが更新されます。ただし、開発者がView Engineを使用していて、汎用タイプを省略したライブラリに依存している場合は、ビルドエラーが発行されます。この場合、ngccは役に立ちません。移行は、アプリケーションコードのみを対象とします。ライブラリを修正するには、ライブラリの作成者に連絡する必要があります。回避策として、tsconfigでskipLibChecksをfalseに設定するか、Ivyのみを使用するようにアプリを更新することができます。
  • TypeScript 3.9が機能するようになり、TypeScript3.8のサポートが削除されました。これは重大な変更です。TypeScript3.6およびTypeScript3.7もサポートされなくなりました。
  • 型チェックのパフォーマンスがcompiler-cliに改善されました。
  • パフォーマンスを向上させるために、の計算はbasePaths怠惰になっているため、で必要な場合にのみ作業が行われTargetedEntryPointFinderます。以前basePaths は、ファインダーがインスタンス化されるたびに計算されていました。これは、ターゲットのエントリポイントがすでに処理されている場合は労力の無駄でした。
  • 複数の翻訳ファイルのマージがサポートされています。以前は、ロケールごとに1つの翻訳ファイルのみが許可されていました。ユーザーはロケールごとに複数のファイルを指定できるようになり、各ファイルからのトランザクションはメッセージングIDによってマージされます。
  • 非同期ロックタイムアウトを構成できます。これにより、AsyncLockerのretryAttemptsおよびretryDelay オプションを設定するためのngcc.config.jsファイルのサポートが追加されます。統合テストは、タイムアウトの新しいチェックを追加し、ngcc.config.jsを使用してタイムアウト時間を短縮し、テストに時間がかかりすぎないようにします。
  • 重大な変更で、不明な要素に関する警告がエラーとしてログに記録されるようになりました。これによってアプリが破損することはありませんが、console.errorを介してログに記録されることを期待しないツールが作動する可能性があります。 
  • 別の重大な変更では、戻るリゾルバーはEMPTYナビゲーションをキャンセルします。ナビゲーションを続行できるようにするには、開発者はリゾルバーを更新して、などの値を更新する必要がありますdefault!Empty。
  • メタデータへの依存関係情報とng-contentセレクターの追加。この提案されたコンパイラ機能は、Angular Language Serviceなどのツールに役立つ追加のメタデータを提供し、ライブラリで定義されたディレクティブ/コンポーネントの提案を提供する機能を提供します。
  • エントリポイントマニフェストのサイズとマニフェストのキャッシュ技術を削減することで達成されるパフォーマンスの向上。さらに、依存関係のキャッシュは、毎回計算されるのではなく、エントリポイントマニフェストで実行され、そこから読み取られます。以前は、エントリポイントが処理を必要としなかった場合でも、ngcc（Angular Ivy互換性コンパイラ）はエントリポイントのファイルを解析して依存関係を計算していました。これは、large_nodeモジュールでは多くの時間がかかります。
  • ngccのパフォーマンスを向上させるために、古いロックファイルの即時レポートが許可されるようになりました。さらに、解析されたtsconfigファイルのキャッシュされたコピーが保存され、tsconfigパスが同じ場合に再利用できます。
  • 重大な変更として、深夜を超える日の期間のフォーマットに関するロジックが更新されました。bまたはBフォーマットコードを使用して時刻をフォーマットすると、レンダリングされた文字列が、日にまたがる日の期間を適切に処理していませんでした。代わりに、ロジックはデフォルトのケースであるにフォールバックしていましたAM。このロジックは更新され、真夜中を過ぎた1日の期間内の時間と一致するようになりat nightました。これにより、英語の場合など、正しい出力がレンダリングされるようになりました。formatDate()orDatePipeまたはband Bフォーマットコードを使用するアプリケーションは、この変更の影響を受けます。
  • ルーターの場合、CanLoadガードはを返すことができUrltreeます。CanLoad帰国ガードは、Urltree現在のナビゲーションとリダイレクトをキャンセルします。これCanActivateは、同じく追加されたガードが利用できる現在の動作と一致します。これはプリロードには影響しません。CanLoadガードブロックを任意のプリロード。CanLoadガードのあるルートはプリロードされず、ガードはプリロードの一部として実行されません。
  • マイクロシンタックス式のExpressionBindingでの正しい値スパンのParsedPropertyへの伝播。これにより、スパンがテンプレートAST（VEとIvyの両方）に伝播されます。この提案はコンパイラー向けでもあります。
  • コアの修正では、Angular機能を使用する装飾されていないクラスの派生クラスを装飾するために、装飾されていないクラスの移行にロジックが追加されます。
  • 重大な変更では、Urlmatcherのタイプは、常にnullを返す可能性があることを反映します。
  • Service-Workerについては、長時間実行されているタスクや繰り返しタイムアウトが発生したときにServiceWorkerが登録されない可能性がある状況が修正されました。
  • コンパイラが穴の開いた配列内の未定義の式を回避し、コアが存在しないシンボルがインポートされたときの移行エラーを回避するなど、多くのバグ修正が行われました。Terserインライン化バグのコアにも回避策があります。別のバグ修正により、TestBedのオーバーライドの影響を受けるモジュールが適切に識別されます。
  • Angular NPMには、ClosureCompilerの高度な最適化をサポートするための特定のjsdocコメントが含まれなくなりました。これは重大な変更です。パッケージでのClosureCompilerのサポートは実験的であり、しばらくの間壊れていました。Closure Compilerを使用する人は、NPMで公開されているバージョンを使用するよりも、ソースから直接ビルドされたAngularパッケージを使用する方が良いでしょう。一時的な回避策として、ユーザーは現在のビルドパイプラインをClosureフラグとともに使用することを検討でき--compilation_level=SIMPLEます。このフラグは、高度な最適化が無効になっているためにペイロードサイズが増加するという犠牲を払って、ビルドパイプラインがビルド可能で実行可能なアーティファクトを生成することを保証します。