November 22, 2022 Smashing Newsletter: Issue #380
This newsletter issue was sent out to 216,217 subscribers on Tuesday, November 22, 2022.
And if you are into design patterns, accessibility and design systems, we’ve also announced SmashingConf Freiburg , taking place at our hometown Freiburg on Sep 4–6, 2023 — with new adventures into everything front-end, from code to design. We’d love to see you there!
— Vitaly (@vitalyf)
1. Understanding Browser Cookies
Have you ever dealt with cookies other than clicking those cookie notifications you get when visiting a website? If not, Hui Jing Chen wrote a great introduction to help you take your first steps in the world of browser cookies.
In her blog post, Hui Jing explores everything you need to know about how browser cookies work. She dives deeper into what cookies do, how cookie attributes influence a cookie’s behavior, and, of course, how to create a cookie. The focus lies on cookies on the client side. (cm)
3. Auditing And Sandboxing Made Easy
If you’re looking for an easy auditing and sandboxing solution to keep your project safe from hand-crafted, zero-day vulnerabilities, Sandworm might be for you. Sandworm watches lower-level APIs like the Node VM and browser APIs like DOM manipulation, fetch, etc., and lets you know when an npm package unexpectedly accesses these APIs. The analysis happens dynamically in the runtime, so Sandworm knows what happens when it happens.
Another useful tool to help reduce security risks comes from Snyk. Their dependency-check checks which modules you use in your code and makes sure they are listed as dependencies in your package.json. To ensure you’re using the healthiest npm packages, it scans all packages for vulnerabilities and provides automated fix advice.
Speaking of healthy npm packages: Snyk Advisor makes it easy to search and compare over 1 million open-source packages to find the healthiest package based on criteria like security, popularity, maintenance, and community. (cm)
4. Upcoming Online Workshops
That’s right! We run online workshops on front-end and design, be it accessibility, performance, or design patterns. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well.
As always, here’s an overview of our upcoming workshops:
- Designing Better Products Masterclass UX
with Stéphanie Walter. Nov 28 – Dec 12
- Building Modern HTML Emails Dev
with Rémi Parmentier. Nov 30 – Dec 8
- Advanced Next.js Masterclass Dev
with Átila Fassina. Nov 30 – Dec 15
- Successful Design Systems Workflow
with Brad Frost. Jan 10–24
- Universal Principles of Typography Masterclass UX
with Elliot Jay Stocks. March 2–16
- Smart Interface Design Patterns Video Course UX
9h-video + UX training on interface design with Vitaly Friedman
- Jump to all workshops →
6. Language-Sensitive Formatting
11/29/2022, 7:00:00 PM or
100,00 €? There’s no right or wrong, only local differences depending on language and country. That’s where the ECMAScript Internationalization API comes in. Available under the namespace
A handy interactive tool that makes the API a lot more comprehensible comes from Jesper Orb: Intl Explorer. Choose a formatter from the menu or visit the playground, and you can start experimenting with the API. Whether it’s currency, date, time, plural rules, collators, or segmenters, the tool helps you find the output your project calls for. To use it, you can copy-and-paste the code snippet to your clipboard with just a click. One for the bookmarks. (cm)
7. Finding Memory Leaks
Performance issues in web apps are noticed immediately by users. Not so memory leaks. They aren’t immediately perceivable but eat up a chunk of memory at a time, making subsequent interactions slower and less responsive. And because they are so hard to spot, root-causing them in production is difficult, too.
8. useMemo And useCallback Explained
Are you struggling to make sense of
useCallback? No worries, you’re not alone. Josh W. Comeau helps clear up the confusion.
In his blog post “Understanding useMemo and useCallback,” Josh dives deep into how
useCallback help us optimize re-renders. He explains in detail how they work, why they are useful, and how to get the most out of them. You’ll also learn more about potential use cases. A comprehensive explanation with lots of practical examples and strategies. (cm)
That’s All, Folks!
Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time!
This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf) and Iris Lješnjanin (il).
Useful front-end & UX bits, delivered once a week. Subscribe and get the Smart Interface Design Checklists PDF — in your inbox. 🎁
You can always unsubscribe with just one click.
- Knowledge Hubs For UX Designers
- Sustainable Design Toolkits
- Web Typography
- UX and Design Process
- Better Meetings and Career Paths
- Useful CSS Techniques
- Design Inspiration From Remote Corners Of The Web
- Privacy and Security
- Little Helpers
- UX Playbooks
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.