KBall, Jerod, and Nick Nisi dive into GraphQL – what it can do, what the challenges are, and how it differs from REST – all with a generous helping of metaphor about buffets, restaurants, and of course bacon.
Cezar Augusto:
It took me just 3 minutes to fully understand the concepts of React Hooks thanks to this great post.
That’s a ringing endorsement, if I’ve ever seen one. If React Hooks are new (or confusing) to you, give this 3 minutes of your time. 😀
This Smashing article is a nice introduction to Tauri, which was news to me as well. It tells you why you might want to use Tauri instead of Electron, how to get set up for Tauri development, and how to build a Vue-based desktop app with the framework.
A neat idea:
turven is a tiny widget that shows how many people are currently on the same page as you, for “warm fuzzy feelings” purposes. There’s something cool about seeing that there’s another soul out there, somewhere on our little blue planet, who’s reading the same thing at the same moment ✨
In practice, I’m not sure if it’ll make us feel less lonely or more lonely:
You’re the only person in the whole world on this web page right now. Why not invite a friend?
I guess it depends on which web pages you frequent…
This is part 3 of a three part series from Sheshbabu Chinnakonda introducing the Rust language to JavaScript developers — this one is focused on functions and control flow.
When Shesh kicked off this series he said, “I find it easier to understand something new if it was explained in terms of something I already know. I thought there might be others like me.”
BTW, here are links to the others from this series:
Blitz.js creator Brandon Bayer joins Jerod to dive deep into the foundational principles of this fullstack React framework. We talk about its inspiration (Ruby on Rails), its differentiation (a “no-API” data layer), and its aspirations (built-in auth, plugins, recipes, and more).
Zach Leatherman:
Instantaneous measurement is a good first step. But how do we ensure that the site maintains good performance and best practices when deploys are happening every day? How do we keep the web site fast? The second step is continuous measurement. This is where Speedlify comes in. It’s an Eleventy-generated web site published as an open source repository to help automate continuous performance measurements.
Sam Bleckley:
The npm ecosystem seems unwell. If you are concerned with security, reliability, or long-term maintenance, it is almost impossible to pick a suitable package to use — both because there are 1.3 million packages available, and even if you find one that is well documented and maintained, it might depend on hundreds of other packages, with dependency trees stretching ten or more levels deep — as one developer, it’s impossible to validate them all.
He then spends some time measuring the extent of the problem.
Did you know Feross taught Web Security at Stanford last Fall? On this episode, Divya and Nick enroll in his security school to learn about XSS, CSP, ambient authority, and a whole lot more.
Julia Evans:
I was pretty surprised by how much I could get done with just plain JS. I ended up writing about 50 lines of JS to do everything I wanted to do, plus a bit extra to collect some anonymous metrics about what folks were learning.
Listeners of JS Party know I’m an advocate for JavaScript sprinkles. Not on every site, but on most sites I think that’s the best way to start out.
Now more than ever, you can get a lot done with what’s right there in the browser. Wait until you feel the pain before you solve the problem. Who knows, maybe you’ll never have to…
This episode of JS Danger recorded for OpenJS World won’t be hitting the audio feed, so I figured I should log it in news for those interested. What’s JS Danger?
JS Party’s don’t-call-it-jeopardy game show where 3 OpenJS World speakers put their web dev knowledge to the test. Can you out-wit your fellow devs? Play along to find out with special guests Cassidy Williams, Prosper Otemuyiwa, and Tiffany Le-Nguyen.
htmx allows you to access AJAX, WebSockets and Server Sent Events directly in HTML, using attributes, so you can build modern user interfaces with the simplicity and power of hypertext.
htmx is small (~7kb gzipped), dependency-free, and even IE11 compatible. It’s the successor to intercooler.js and even comes bundled with a very nice haiku:
javascript fatigue:
longing for a hypertext
already in hand
This auth lib has a nice set of features, including support for a bunch of oauth providers. What I really appreciate about a solution like this (vs relying on a 3rd party) is the own your own data bit:
- An open source solution that allows you to keep control of your data
- Supports Bring Your Own Database (BYOD) and can be used with any database
- Built-in support for for MySQL, MariaDB, Postgres, MongoDB and SQLite
- Works great with databases from popular hosting providers
- Can also be used without a database (e.g. OAuth + JWT)
We take a listener request this week and discuss how we evolve alongside (or opt out of) the ever changing JavaScript syntax. Arrow functions and variable declarations take center stage, but a wide range of new(ish) JS syntax and features are discussed.
Then Feross shares his new app, Nick talks fiction books, and Jerod switches coding fonts.
How’s the saying go? Choose well-understood, “boring technologies”…we often reach for the new and shiny just for the joy of tinkering with something.
Psst, I have invented the time machine (don’t tell anyone)! Let us quickly travel back in time to 2016. SWOOSH! We are there. JavaScript landscape looks like this:
If you are using a JavaScript framework or want to use a framework, Angular.js is probably something you would choose. But, the news about Angular 2 that will make you rewrite almost everything is just around the corner. Also, this new kid on the block - React.js is coming up and getting ripe. Of course, Vanilla JS and no-framework-folks are there. Not using a framework is still a popular opinion in 2016, but is slowly fading.
Knowing all this, what would you do? Which path would you choose and why?
We often try new frameworks and tools in side projects or throwaway contexts, but you don’t learn that much about a thing until you use it to build something real. That’s why we have Mat Ryer and David Hernandez joining us to share their experience of using Svelte while building their new startup, Pace.dev.
Lightweight, no vendor/framework lock-in, and easy on the eyes. 🤩
This is inspired by Apple’s AirDrop (which is the greatest thing since Napster). ShareDrop lets you transfer files directly between devices without having to upload them to a server first.
ShareDrop allows you to send files to other devices in the same local network (i.e. devices with the same public IP address) without any configuration - simply open www.sharedrop.io on all devices and they will see each other. It also allows you to send files between networks - just click the + button in the top right corner of the page to create a room with a unique URL and share this URL with other people you want to send a file to. Once they open this page in a browser on their devices, you’ll see each other’s avatars.
The major advantage that AirDrop has is that you need an internet connection to discover devices with ShareDrop. The major advantage that ShareDrop has is that you can share between Android and Apple devices.
Rough Notation uses RoughJS to create a hand-drawn look and feel. Elements can be annotated in a number of different styles. Animation duration and delay can be configured, or just turned off.
Follow the headline link to see it in action on the project’s website. This would be great for product or feature walk-throughs. What would be super cool is some way to use this on any website and send the annotated version to someone for review. Then it could be used for bug reporting, etc.
JS Danger is back! Suz, Emma, and Divya square off in our don’t-call-it-jeopardy game show. Will Emma totally redeem herself? Are Divya’s trivia skills as on point as her debate skills? Will Suz murder Jerod in a fit of terrible-question-inducing rage?! Listen and play along!
Evan You writes up lessons learned from rewriting the next major version of Vue.js.
Two key considerations led us to the new major version (and rewrite) of Vue: First, the general availability of new JavaScript language features in mainstream browsers. Second, design and architectural issues in the current codebase that had been exposed over time.
I found the section on overcoming the bottleneck of the Virtual DOM (and decreasing CPU time by up to 90%) fascinating. ASTs FTW once again!
Lea Verou shared this story of using Javascript for the first time…
Today I tried to help a friend who is a great computer scientist, but not a JS person use a JS module he found on Github. Since for the past 6 years my day job is doing usability research & teaching at MIT, I couldn’t help but cringe at the slog that this was. Lo and behold, a pile of unnecessary error conditions, cryptic errors, and lack of proper feedback. And I don’t feel I did a good job communicating the frustration he went through in the one hour or so until he gave up.
It went a bit like this…
This comes from the just-announced Supabase, which is “an open source alternative to Firebase”. Oh, and if you’re thinking NOTIFY is good enough… maybe it is, maybe it isn’t.
Tobias Uhlig:
Neo is based on top of ES8 and uses the latest ES features as long as they can run directly inside the browser. This is one of the major design goals: the dev mode can run inside a browser without needing any JS related builds or transpilations. Instead of using any kind of templates, persistent JSON structures are in place. The combinations of these concepts lead to a pretty amazing performance and adds new possibilities for scaling to the UI area.
I haven’t seen any benchmarks or examples where using Neo produces extreme performance, but conceptually it makes sense that moving computationally expensive things to background threads would keep your UI thread snappy.
