Preload, prefetch and other link tags: what they do and when to use them · PerfPerfPerf
Following on from Harry’s slides, here’s another round-up of thoserel attribute values that begin with pre.
Tags: resource
80
More Than You Ever Wanted to Know About Resource Hints - Speaker Deck
Slides from Harry’s deep dive into rel values: preconnect, prefetch, and preload.
Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!
The 2019 edition of Cody Lindley’s book is a good jumping-off point with lots of links to handy resources.
Limiting JavaScript? - TimKadlec.com
Following on from that proposal for a browser feature that I linked to yesterday, Tim thinks through all the permutations and possibilities of user agents allowing users to throttle resources:
If a limit does get enforced (it’s important to remember this is still a big if right now), as long as it’s handled with care I can see it being an excellent thing for the web that prioritizes users, while still giving developers the ability to take control of the situation themselves.
Learn Vanilla JS
Chris Ferdinandi is a machine!
A vanilla JS roadmap, along with learning resources and project ideas to help you get started.
The 15 Web Design Books of 2018 You Can’t Afford to Miss
How lovely! Going Offline is in very good company in this list, and Oliver has some nice words to say about it:
Starting with no assumption of JavaScript knowledge, Jeremy explains the latest strategies, the ins and outs of fetching and caching, how to enhance your website’s performance, and more.
Extremely beginner-friendly and approachable, it can be read in half a day and will help you get Service Workers up and running in no time.
But all I want for Christmas is for Shopify to stop enabling Breitbart.
Remove Background from Image – remove.bg
Well, this looks like it could come in handy—no more tedious time in Photoshop trying to select turn a person into a separate layer by hand; this does it for you.
GitHub - frctl/awesome-fractal: A curated list of awesome things related to Fractal
A starter list of Fractal examples and links. You can expand it.
Resources about Front-end Architecture and Design Systems, etc. | Lara Schenck
A great selection of links about design systems, collected and categorised.
A Book Apart, Front-End Next Steps
If you buy this bundle of books, you get Going Offline in some very, very good company.
33 Concepts Every JavaScript Developer Should Know
Please ignore the hyperbolic linkbaity title designed to stress you out and make you feel inadequate. This is a handy listing of links to lots of JavaScript resources, grouped by topic …some of which you could know.
A Directory of design and front-end resources
A collection of collections.
This site is dedicated to compiling and sharing useful resources for Designers and UI Developers.
Just Starting Out with CSS & HTML - CSS-Tricks
It’s great that we’ve got so many resources these days for keeping up with the latest and greatest developments in HTML, CSS, and JavaScript …but I think it’s really great that Chris maintains this collection of evergreen tutorials on the basics.
Useful accessibility resources
A whoooole bunch of links about inclusive design, gathered together from a presentation.
The Power of Serverless
Chris has set up a whole site dedicated to someone-else’s-server sites with links to resources and services (APIs), along with ideas of what you could build in this way.
Here’s one way to think about it: you can take your front-end skills and do things that typically only a back-end can do. You can write a JavaScript function that you run and receive a response from by hitting a URL. That’s sometimes also called Cloud Functions or Functions as a Service, which are perhaps better names, but just a part of the whole serverless thing.
Learn JavaScript with Zell
This JavaScript training course looks like it’s really well planned to take you from zero to hero—there’s a whole module on progressive enhancement.
Voice Guidelines | Clearleft
I love what Ben is doing with this single-serving site (similar to my design principles collection)—it’s a collection of handy links and resources around voice UI:
Designing a voice interface? Here’s a useful list of lists: as many guiding principles as we could find, all in one place. List compiled and edited by Ben Sauer @bensauer.
BONUS ITEM: Have him run a voice workshop for you!
New A List Apart wants you! · An A List Apart Article
We’re getting rid of advertisers and digging back to our roots: community-based, community-built, and determinedly non-commercial.
I approve!
A List Apart has given me so, so much over the years that becoming a supporter is quite literally the least I can do.
advanced-js-resources.md
Following on from that intro-level book on JavaScript, here’s a handy list of resources for learning more advanced JavaScript.
Progressive Web Apps - ILT | Web | Google Developers
A step-by-step guide to building progressive web apps. It covers promises, service workers, fetch, and cache, but seeing as it’s from Google, it also pushes the app-shell model.
This is a handy resource but I strongly disagree with some of the advice in the section on architectures (the same bit that gets all swoonsome for app shells):
Start by forgetting everything you know about conventional web design, and instead imagine designing a native app.
Avoid overly “web-like” design.
What a horribly limiting vision for the web! After all that talk about being progressive and responsive, we’re told to pretend we’re imitating native apps on one device type.
What’s really disgusting is the way that the Chrome team are withholding the “add to home screen” prompt from anyone who dares to make progressive web apps that are actually, y’know …webby.