A recent installment of a newsletter that I subscribe to started off talking about how the author still loved Sublime Text, but felt like an outsider for having not switched to VS Code, as it seems the rest of the developer world has. S/he suggests a video that “might be just what you need to consider a switch”. I have VS Code, have tried switching multiple times, once for more than a week, but just find myself coming back to Sublime Text… And I watched that video weeks ago. I agree that VS Code is awesome, but maybe it is too much? I know having it open for more than 2-3 minutes makes my MacBook sound a 767 warming up for a flight to Rio… But, maybe some day…
Speaking of “converting”, I have yet to buy into any one particular app framework… Angular, React, Vue, they all individually came into their own while I was sort of… ignoring… modern web development for a li’l bit… And I have seen nothing to make me buy into any specific one, so I have just been sitting in limbo. Until yesterday. Yesterday I had the pleasure of watching a video with Rich Harris talking about Svelte, and I have to say, I am sold. What I have always hated about such frameworks is their “everything relies on JS” nature and how heavy the initial page load is. Svelte turns both of those on their heads, delivering fully built HTML pages with only the CSS/JS that page needs. Additionally, and even more importantly, Svelte changes how it “reacts” to changes within the app: rather than bubbling through the entire DOM Object to affect state changes, Svelte maintains state much closer, allowing for much more performant UI updates! Yes, it requires a build process, but to me, that is a worthwhile trade-off! Now I just need to learn it…
And speaking of Jeremy Keith, the good folks at Clearleft worked with some of the good folks at Google to put together this course on Responsive Design. Recommend it to anyone that might need it, or have a look yourself, never know when you find a new trick or are reminded of something you forgot!
Okay, but back to performance for a sec, how many times, while initially coding or refactoring something, have you wondered which way of implementing something is more performant? I do it all the time, and find myself hacking quick time tests in my DevTools. Well, no more, as Hasty allows you define any variables your tests might need, then paste multiple code options, and click Run to see how many iterations per second each code option can complete. Note, the higher the number, the better… ;-)
Staying with performance for another sec, here are several methods for improving performance of third-party embeds. I have used the “facade” method for Google Maps before. Not only does it speed the page load, but it also saves a fair bit of cash on dynamic API calls with every page load!
Scroll-Linked Animations With the Web Animations API (WAAPI) and ScrollTimeline. I think that about covers it! Some cool UI stuff once this comes of age!
I don’t think I have ever done this before, but… this Smashing Magazine Newsletter is just chock-full of fantastic articles! A few highlights are:
- The Ultimate Guide to Designing Data Tables
- Design better data tables
- UX Pattern Analysis: Enterprise Data Tables (and how cool are this image comparison sliders?!?!)
- Designing a complex table for mobile consumption
- One Checkbox vs Two Radio Buttons
- A better segmented control, but especially this image!
- Form design: from zero to hero all in one blog post
- Learn Forms
- Inclusive Components
- Complex Forms Made Simple
- Modal & Nonmodal Dialogs: When (& When Not) to Use Them
- The problem with tooltips and what to do instead
Seriously? I should have just said “Never mind, just click that link and read everything…”
And finally, pretty blown away with StackBlitz… VS Code in your browser, hot reloading, sync across multiple devices, share via live URLs (including the hot syncing refresh), GitHub integration, interact with individual live users… Blown away. Bravo.
Happy reading,
Atg