Top Front‑End Releases: AppWorks 1.5, Parcel 2, Superplate, DOM Treemap & Sanitizer API

News

AppWorks 1.5.0 released

New features:

Supports automatic import of style files, making it faster to write styles in JSX.

The AppWorks GitHub organization name has changed from

appworks

to

apptools-lab

to bring more simple development tools to the community.

Release: apptools-lab/AppWorks/releases/tag/v1.5.0

Parcel 2 released

On October 13, the Parcel team released Parcel v2.0.0, continuing the zero‑configuration bundling experience of Parcel 1 while adding powerful extensibility for projects of any size and complexity.

New features:

New plugin system that provides full extensibility, allowing Parcel to scale from small projects to large production applications.

Tree shaking enabled by default, supporting ES modules, CommonJS, dynamic import and CSS modules.

Huge performance improvements thanks to a new JavaScript compiler written in Rust and a multi‑threaded architecture that utilizes all CPU cores.

…etc.

Release: https://parceljs.org/blog/v2

Open Source

pankod/superplate

A well‑structured production‑ready front‑end starter kit that includes TypeScript, Jest, testing‑library, styled‑components, Sass, CSS, .env, Fetch, Axios, reverse proxy, Bundle Analyzer and more than 30 plugins. Currently supports creating React and Next.js applications.

GitHub Repo: pankod/superplate

DOM Treemap

A Chrome and Firefox DevTools extension that helps you visualize the distribution of DOM nodes in the document tree.

GitHub Repo: Schepp/dom-treemap-devtools-extension

theatre

Theatre.js is an animation library for high‑fidelity motion graphics. It helps you express detailed animations, enabling the creation of complex motions and subtle nuances.

GitHub Repo: AriaMinaei/theatre

Article

Sanitizer API: A New W3C Proposal to Effectively Prevent XSS Attacks

For many years, DOM‑based XSS has been one of the most common and dangerous web security vulnerabilities. According to Imperva reports, XSS was the most prevalent web‑based attack in 2014‑2017, ranking second only to SQL injection in 2018.

The new Sanitizer API proposal allows developers to safely insert arbitrary strings into a page:

<code>$section.setHTML(`&lt;em&gt;hello world&lt;/em&gt;&lt;img src="" onerror=alert(0)&gt;`, new Sanitizer());</code>

Original article: https://mp.weixin.qq.com/s/obxkffBekwBofTDD_jwVNg