#599 — July 22, 2022 |
JavaScript Weekly |
RedwoodJS vs. Blitz.js: The Future of Fullstack Meta-Frameworks — Quite a lengthy review of both frameworks. Redwood is an opinionated React-based framework oriented heavily round the idea of a GraphQL server as the ‘one API’ at the heart of an app. Blitz, on the other hand, is a Ruby on Rails-inspired layer on top of Next.js with SPA, server side rendering and static site generation chops. Don't forget Remix too.. this is a busy space! Tamas Kadlecsik |
Ten Common JavaScript Issues Developers Face — If you’ve been working with JavaScript for many years (perhaps since 2014 when this newly-updated article was first penned), these are potholes you (probably) already know how to steer around, but there’s plenty to chew on here otherwise. Ryan J. Peterson |
CSS Animations and Transitions — Join David Khourshid on this detailed video course and discover how to bring your interfaces to life with UI animations. Learn about CSS transitions, keyframes, custom properties, choreography, animation states, and much more Frontend Masters sponsor |
Reducing the Size of a Large JavaScript SDK Package by 29% — After some comments on how large their JavaScript package was getting, developers at Sentry (an app monitoring service) set to work trying to get an initial 30% reduction. Tree shaking turned out to have the biggest effect. Abhijeet Prasad (Sentry) |
Payload 1.0: A Headless CMS Platform Built on Node — An exciting project that appeared in early 2021 with a bang then became open source just a couple of months ago. There’s a lot to like about Payload if you need a headless CMS including a customizable React-based admin system, GraphQL or REST APIs, flexible auth and file upload systems, and it’s easy to get started. GitHub repo. Payload CMS |
IN BRIEF:
|
RELEASES: NeutralinoJS 4.7.0 – Lightweight cross platform apps with JS & HTML. |
📒 Articles & Tutorials |
Thoughts on Integer Math in JavaScript — No concrete examples here but if fast integer math is something you need, you could do worse than to build upon James’ thinking (to which he hopes to write a more complete follow-up). James Darpinian |
JavaScript Obfuscation Techniques by Example — The Hacker News discussion around this article was, perhaps, even more interesting, I thought. Trickster Dev |
10 npm Security Best Practices Snyk.io sponsor |
JavaScript AST Manipulation with Babel: The First Steps — From the same author as the item on obfuscation (above) comes a look at the basics of using Babel to turn obfuscated code into a syntax tree and then back into more readable JavaScript. Trickster Dev |
▶ An Introduction to SvelteKit in 80 Minutes — Svelte is an increasingly popular way to build reactive frontend apps and SvelteKit provides a framework and more complete development experience around Svelte. Nacho gives us a tour. Nacho Falk |
▶ Blazingly Fast 'React' with Fresh — One of the most popular React YouTubers out there heads Deno-side to look at Fresh, a new islands-based web framework that doesn’t use React per se but.. close enough, with Preact and JSX for rendering and templating. Jack Herrington |
2022 State of the Java Ecosystem Report — New Relic’s report is based on data gathered from millions of applications providing performance data. New Relic sponsor |
Converting Cypress E2E Specs from JavaScript to TypeScript — More to it than you might expect. |
🛠 Code & Tools |
Tweakpane 3.1: Compact UI Element for Tweaking Parameters and Viewing Value Changes — This is the sort of thing you see in creative coding demos quite often, but could be used almost anywhere. You can create your own mini pane of basic UI controls to dynamically adjust (or just reflect) values relating to something going on on the page. It’s simple and looks great, and if you want a demo, then… cocopon |
Fireworks.js 2.0: It's Literally Fireworks for Your Web Page — Well, literally in a visual sense at least ;-) The homepage is a neat demo given you can dynamically play around with all of the library’s parameters (courtesy of Tweakpane, mentioned above!) Vitalij Ryndin |
Breakpoints and Wallaby.js sponsor |
Superstate: A New 'Micro' State Management Library — So micro, even, that the getting started tutorial takes all of 30 seconds to read. GitHub repo. Guilherme Oderdenge |
TanStack Table v8: Headless UI for Building Tables and Datagrids — Want the hard work of managing a table or data grid element taken care of but want to keep 100% control over markup and styles? This is what you need (if the idea of a ‘headless UI’ is new to you, read this intro). Vanilla JS, React, Vue, Solid and Svelte developers are all taken care of. Tanner Linsley |
Atropos: Create Touch-Friendly 3D Parallax Hover Effects — Use with plain JS, React, or Vue and it’s easy to configure with no dependencies. The home page includes some quite striking examples that aren’t as over the top as you’d expect. Vladimir Kharlampidi |
OTHER QUICK RELEASES: PrimeNG 14 – Suite of 80+ Angular UI components. |
|
❓ Did you know..
|