---
title: "Transformers: JavaScript in Disguise"
publication: "JavaScript Weekly"
issue: 630
published_at: "2023-03-17"
canonical_url: "https://javascriptweekly.com/issues/630"
---

Plus TypeScript 5.0, easier view transitions within SPAs, and ten years of Electron. |        

#​630 — March 17, 2023 

[Read on the Web](https://javascriptweekly.com/issues/630)  

Together with [![Dynaboard logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,e_trim,w_500,h_100/e_make_transparent/co_white,e_outline:7/xh5y6qe2tcrjx1vxyfer.png)](https://dynaboard.com/?utm_source=cooperpress-jw&utm_medium=email&utm_campaign=visualide-q12023)  

JavaScript Weekly 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/vsvq1xzcnw8ep6tpxlpe.jpg)](https://xenova.github.io/transformers.js/)  

🤖 [Transformers.js: Running ML Models in the Browser](https://xenova.github.io/transformers.js/) — Transformers are a type of machine learning model often used for natural language or visual processing and while running such models directly in the browser is in its infancy, Transformers.js opens up _some_ ML models to you with some impressive demos here. 

Xenova   

🎉 [Celebrating 10 Years of Electron](https://www.electronjs.org/blog/10-years-of-electron) — It feels like Electron pops up everywhere (Slack, Spotify, VS Code, and more) so it might feel surprising it’s only been with us for a decade. Slack and Electron developer Erick Zhao gives thanks to Electron’s developers, the community, gives us a bit of Electron related history, and reassures us Electron is still going strong. 

Erick Zhao   [![\](https://copm.s3.amazonaws.com/3cf4c3b3.png)](https://dynaboard.com/?utm_source=cooperpress-jw&utm_medium=email&utm_campaign=visualide-q12023) 

[Dynaboard: A Visual Web App IDE Made for Developers](https://dynaboard.com/?utm_source=cooperpress-jw&utm_medium=email&utm_campaign=visualide-q12023) — Build high performance public and private web applications in a collaborative — full-stack — development environment. 

Dynaboard sponsor   

[Announcing TypeScript 5.0](https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/) — Note that TypeScript doesn’t follow semantic versioning, so this is as much a ‘major’ release as 4.9 was.. but 5.0 looks cool anyway. This release of the typed JavaScript superset is packed with features like decorators, improved ESM project support for Node and bundlers, `const` type parameters, and more. 

Daniel Rosenwasser (Microsoft)   

[Turbowatch: File Change Detector and Task Orchestrator](https://github.com/gajus/turbowatch) — Not just that but it claims to be _extremely fast_ and _“if you ever wanted something like Nodemon but more capable, then you are at the right place.”_ This looks very promising and the README is full of examples. 

Gajus Kuizinas   

**IN BRIEF:** 

- **BREAKING NEWS:** The _JS Party_ podcast has _just_ dropped an episode called [▶️ The Future of React](https://changelog.com/jsparty/267) – so new, we haven't listened to it, but it features Dan Abramov and Joe Savona so may make for good weekend listening..
- **"The most dangerous command you run every day: `npm install`"** says Socket, who are [introducing what they call 'safe npm'](https://socket.dev/blog/introducing-safe-npm), a transparent wrapper around `npm` designed to, well, make it less dangerous.
- **CORRECTION:** In [issue 627](https://javascriptweekly.com/issues/627) we suggested the ECMAScript 2023 spec had entered a new draft stage. TC39 member Jordan Harband pointed out to us that it has been in such a state for some time. _"There's still a stage 4 PR not yet merged,"_ he noted, but there will be some progress in the next month.
- [Defer](https://www.defer.run/) is a new 'zero-infrastructure' background jobs platform for Node.js apps.
- Recently we linked to [🎵 Dittytoy](https://dittytoy.net/ditty/24373308b4), a fun online JavaScript environment for audio coding/experiments. Someone has somehow implemented [an entire Commodore 64 SID synthesizer](https://dittytoy.net/ditty/c35f3133c0) in it!   

📅 [Developer Day: A Front-Row Seat to What's New with Retool](https://retool.com/events/retool-developer-day/?utm_medium=newsletter&utm_source=sponsor&utm_campaign=javascriptweekly) 

Retool sponsor   

**RELEASES:** 

- [Node.js v19.8.0/1 (Current)](https://nodejs.org/en/blog/release/v19.8.1)
- [Jasmine 4.6](https://github.com/jasmine/jasmine/blob/main/release_notes/4.6.0.md)
 ↳ Testing framework for browsers and Node.
- [pm2 5.3](https://github.com/Unitech/pm2)
 ↳ Popular Node production process manager.
- [Mongoose 7.0](https://thecodebarbarian.com/introducing-mongoose-7.html)
 ↳ Popular MongoDB ODM for Node.js.
- [ESLint 8.36](https://github.com/eslint/eslint/releases/tag/v8.36.0)  

📒 Articles & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/mqowjle9vqukvhbdwkiw.jpg)](https://developer.chrome.com/blog/spa-view-transitions-land/)  

[Chrome 111 Gains a 'View Transition' Feature for SPAs](https://developer.chrome.com/blog/spa-view-transitions-land/) — The View Transition API is only supported by Chrome so far, but allows easy animated page transitions _within_ single-page apps ([demo here](https://http203-playlist.netlify.app/)). Luckily it suits progressive enhancement so you can start using it right now without feeling _too_ guilty ;-) Multi-page app support is forthcoming. 

Jake Archibald (Chrome Developers)   

[Create and Download Text Files with JavaScript](https://www.amitmerchant.com/create-and-download-text-files-using-javascript/) — If you want your code to be able to generate a text (such as JSON) file on the fly and have it downloaded by the user’s browser, it’s reasonably easy. 

Amit Merchant   

[Five Mistakes I Made When Starting My First React Project](https://css-tricks.com/5-mistakes-starting-react/) — Richard shares his early React mistakes with the hope you can learn from his misfortunes. He tackles topics like using `defaultProps`, `propTypes`, and class components. 

Richard Oliver Bray   

[Too Much Tech Debt in Your node_modules? Our Team of JS Devs Can Help](https://www.upgradejs.com?utm_source=cooperpress&utm_campaign=js-weekly-march-16&utm_medium=js_weekly_newsletter) — We are a team of senior software engineers who specialize in tech debt. Let us modernize your JavaScript stack 🚀 

UpgradeJS.com | JavaScript Upgrade Services sponsor   

[Progressively Enhancing a Table with a Web Component](https://www.raymondcamden.com/2023/03/14/progressively-enhancing-a-table-with-a-web-component) — Building a web component wrapper to add table sorting. 

Raymond Camden   

[Shell-Free Node.js Scripting with Execa 7.1](https://itnext.io/shell-free-scripts-with-execa-7-885fb3b42f83) — [Execa](https://github.com/sindresorhus/execa) is a popular process execution library for Node and the [latest version](https://github.com/sindresorhus/execa/releases/tag/v7.1.0) includes an interesting `$` method feature for writing [zx](https://github.com/google/zx)-style scripts with it, making it even more useful for shell scripting style usecases. 

ehmicky   

[What is Vite and Why Use It Over _Create React App_?](https://luketheweb.dev/blog/what-is-vite-and-why-should-you-use-it-instead-of-create-react-app) 
Luke Twomey   

[Pointers on Upgrading from Cypress v9 to v12](https://glebbahmutov.com/blog/upgrade-cypress-v9-to-v12/) 
Gleb Bahmutov   

[How to Use `v-model` with Form Inputs in Vue](https://dmitripavlutin.com/vue-v-model-form-inputs/) 
Dmitri Pavlutin   

[How to Create and Use Path Aliases in TypeScript Imports with Vite](https://hsblhsn.me/how-to-create-and-use-path-alias-in-typescript-imports-with-vite) 
Hasibul Hasan   

[What Is Deno and How to Use Its Sandbox?](https://www.zaynetro.com/post/what-is-deno/) 
Roman Zaynetdinov  

🛠 Code & Tools 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/epif1hhzekl0vxa7wbs0.jpg)](https://github.com/retrohacker/template)  

[Template: A Simple Framework for Webapps](https://github.com/retrohacker/template) — The author built it for his own projects, but [notes](https://news.ycombinator.com/item?id=35188838): _“It’s a joy to work in, feels “frameworky” but it’s just web standards with <100 lines of convenience JS wrapped around it. There is no magic beyond what the browser provides - I like it that way.”_ We do too. 

William Blankenship   

[React ProseMirror: Integrate the ProseMirror Editor with React](https://github.com/nytimes/react-prosemirror) — [ProseMirror](https://prosemirror.net/) is a toolkit for building rich text editors for the Web. 

The New York Times   

[Breakpoints and `console.log` Is the Past, Time Travel Is the Future](https://wallabyjs.com/?utm_source=cooperpress&utm_medium=javascriptweekly&utm_content=javascriptweekly) — 15x faster JavaScript debugging than with breakpoints and console.log, now with support for Vitest. 

Wallaby.js sponsor   

[Fable 4.0: F# to JavaScript Compiler](https://fable.io/) — If you fancy F#’s flavor of almost-entirely-functional development, this could be for you. [GitHub repo.](https://github.com/fable-compiler/Fable) 

Fable   

[MiniSearch: Small In-Memory Fulltext Search Engine for Browser and Node](https://github.com/lucaong/minisearch) — The strength is that the indexed data is stored locally, allowing it to work offline and giving good performance, as seen in [this demo.](https://lucaong.github.io/minisearch/examples/) 

Luca Ongaro   

[css-variable: Tiny Treeshakable Library to Define CSS Custom Properties in JS](https://css-variable.js.org/) — Compatible with popular CSS-in-JS libraries like Emotion, styled-components, Linaria, etc., and it boasts better CSS minification and smaller virtual DOM updates, among other features. 

Jan Nicklas   

[Tremor 2.0: The React Library to Build Dashboards Fast](https://www.tremor.so/changelog) — Provides an array of modular components to build data-driven dashboards. v2.0 is the _“first step towards a production-ready version of Tremor”_ and sees a full switch to Tailwind CSS. [Homepage.](https://www.tremor.so/) 

Tremor Labs   

[Stable Diffusion Plugin for Photoshop](https://github.com/AbdullahAlfaraj/Auto-Photoshop-StableDiffusion-Plugin) — Writing code that worked with Adobe’s weird JS variant was ghastly, but this uses their [new 'UXP' based approach](https://developer.adobe.com/photoshop/uxp/2022/), so is interesting enough for that alone. This plugin also opens up the Stable Diffusion generative art system to Photoshop users. 

Abdullah Alfaraj   

[Flexboard: A React Component Library for Resizable Sidebars](https://github.com/dorbus/flexboard) — Try the [live example](https://dorbus.github.io/flexboard-example/). The code allows you to set min/max sizes for the resizable parts of the layout. 

Dorbus     

💻 Jobs  

[Full Stack JavaScript Engineer @ Emerging Cybersecurity Startup](https://defendify.breezy.hr/p/b07e57b21e02-saas-software-engineer) — Small team/big results. Fun + flexible + always interesting. Come build our award-winning, all-in-one cybersecurity platform. 
Defendify   

[Software Engineer (Frontend)](https://jobs.ashbyhq.com/stickermule/6de4ccd8-7e58-4b65-9a25-62354972bdbd?utm_source=Cooperpress) — Join our "kick ass" team. Our software team operates from 17 countries and we're always looking for more exceptional engineers. 
Sticker Mule   

[Find JavaScript Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-javascriptweekly%29&utm_content=easy-job-hunting) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. 
Hired   

🧑‍💻 Got a job listing to share? _[Here's how](https://booking.cooperpress.com/jobs)_.     

- [Fuite 2.0](https://github.com/nolanlawson/fuite)
 ↳ Tool for finding memory leaks in web apps.
- 🎼 [wavesurfer.js 6.6](https://github.com/wavesurfer-js/wavesurfer.js)
 ↳ Navigable waveform built on Web Audio & canvas.
- [Svelte-Inview 4.0](https://github.com/maciekgrzybek/svelte-inview)
 ↳ Svelte action that monitors when an element enters/leaves the viewport.
- [Discord.js 14.8](https://github.com/discordjs/discord.js)
 ↳ Library for using the Discord chat API.
- [Plotly.js 2.20](https://github.com/plotly/plotly.js)
 ↳ Powerful charting library. ([Examples.](https://plotly.com/javascript/))
- [Recharts 2.5](https://github.com/recharts/recharts)
 ↳ React + D3 charting library. ([Examples.](https://recharts.org/en-US/examples))
- [deepmerge 4.3.1](https://github.com/TehShrike/deepmerge)
 ↳ Merges the enumerable properties of objects.
- [Vue Testing Library 7.0](https://github.com/testing-library/vue-testing-library)
- [React Table Library 4.1](https://github.com/table-library/react-table-library)         

Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/cooperx86) 

'JavaScript' is a trademark of Oracle Corporation in the US
We are not endorsed by or affiliated with Oracle. 

[Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). 

© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom