Angular 10 isPlatformWorkerUi API

Angular 10 introduces a new API called isPlatformWorkerUi that allows developers to detect if the current platform is a web worker or not. This API is useful for applications that use web workers and need to handle the differences between the web worker environment and the regular UI environment.

What is a Web Worker?

A Web Worker is a JavaScript running in the background, independently of other scripts, without affecting the performance of the page. Web Workers are useful for performing time-consuming tasks such as fetching data from APIs, processing large amounts of data and generating reports without blocking the main UI thread.

How to Use isPlatformWorkerUi

To use isPlatformWorkerUi you will need to first import the PLATFORM_ID and isPlatformBrowser from the @angular/common package.

import { PLATFORM_ID, isPlatformBrowser } from '@angular/common';

Once imported, you will need to inject the PLATFORM_ID into your component or service constructor and then use isPlatformWorkerUi to check the current platform.

import { Component, Inject, PLATFORM_ID } from '@angular/core';
import { isPlatformWorkerUi } from '@angular/common';

@Component({
  selector: 'app-my-component',
  template: `{{platformMessage}}`
})
export class MyComponent {
  platformMessage: string;

  constructor(@Inject(PLATFORM_ID) private platformId: Object) {
    if (isPlatformWorkerUi(this.platformId)) {
      this.platformMessage = 'This code is running in a Web Worker!';
    } else {
      this.platformMessage = 'This code is running in the regular UI environment!';
    }
  }
}

Conclusion

The isPlatformWorkerUi API is a useful addition to Angular 10 and provides a simple way to detect if the code is running in a Web Worker or the regular UI environment. This can help developers write more effective and efficient code when dealing with the differences between these two environments.