Ah, and just before we head there, perhaps take a look at our upcoming React Performance Masterclass, along with a few other friendly online workshops on front-end & UX on everything from web performance to design systems. Or perhaps kindly forward it to your friends — we’d sincerely appreciate it.
— Vitaly (@smashingmag)
- What’s The Right Bundling Tool?
- Upcoming Front-End & UX Workshops
- Strategies For Migrating To TypeScript
Most of us use one or the other bundler for our assets, but is it fast and flexible enough? Does it support features that other bundlers can do? And does it actually matter? Well, it might. Tooling.Report runs a suite of build tool tests — configuration files created to specifically handle a feature — and evaluates how well bundlers deal with these particular issues. The configuration files are tested in Browserify, Parcel, Rollup and Webpack.
Perf-Track tracks framework performance at scale. It basically tracks the performance in terms of Core Web Vitals for Angular, React, Vue, Polymer, Preact, Ember, Svelte and AMP — on mobile and on desktop. The data set is currently still from 2020, but it gives us some insights into how well sites with these frameworks perform in the wild. For example, React with Gatsby perform better than the ones created with Create React app.
Tim Kadlec also conducted some research around that, comparing jQuery, Vue.js, Angular and React. The end result: the current crop of frameworks isn’t doing enough to prioritize less powerful devices and help to close the gap between desktop and mobile. These figures might give you at least some context to make a more informed decision. (vf)
The deep knowledge of a subject really lies in understanding subtle differences between alternate ways of solving the same problem. How is
nodeName different from
tagName? How are the two increment operators different, e.g.
that is a friendly reference site for sorting out just this kind of questions.
Our workshops are packed with practical examples, video recordings and friendly Q&A sessions. Each and every workshop has been a truly smashing experience with wonderful folks from all over the world. There are still some early-birds left, with a lil’ friendly discount. Perhaps you’d like to join us and recommend to others — just sayin’! ;-)
Stephen Harfield has published a simple 10-mins read for migrating to TypeScript, a strategy to smoothly and efficiently migrate over to Typescript, including how to deal with styled components and how to move from JSX to TSX.
Finally, for large projects, when migration may produce too many errors, snapshot-testing the TypeScript errors may be an option. A great overview to help find the strategy that best matches your project’s needs. (cm)
- CSS Global Resets, Gradients and Transitions
- Interface Design Patterns
- Web Performance Optimization
- Designing and Building Dark Mode
- CSS Tools, CSS Data Charts and Fluid Typography
- Front-End Accessibility
- Color Palettes Generators and Tools
- Front-End Boilerplates and Starter Kits
- VS Code Extensions
- Figma Plugins and Tools
Looking for older issues? Drop us an email and we’ll happily share them with you. Would be quite a hassle searching and clicking through them here anyway.