Bookmarks tagged with #webdev.
Show all
Show all
Poline
poline is lightweight, dependency free and fast JavaScript function written in TypeScript. It draws lines between anchors over polar coordinates to generate pleasing color palettes.
Saved
on: 2025-06-19
Y2Z/monolith
⬛️ CLI tool and library for saving complete web pages as a single HTML file - Y2Z/monolith
Saved
on: 2024-03-25
Correctly Configure (Pre) Connections – Harry Roberts – Web Performance Con
We’re probably familiar with preconnect, but are we getting it right?
Saved
on: 2023-12-10
Pacchetto di CSS: 2023!
Il 2023 è stato un anno fantastico per CSS. Scopri quali contenuti sono arrivati quest'anno a Chrome e alla piattaforma web.
Saved
on: 2023-12-08
Accessible Palette: stop using HSL for color systems
Accessible Palette is an app for building color systems with consistent lightness and predictable contrast ratios across color levels.
Saved
on: 2023-08-29
The ideal viewport doesn’t exist
Before you settle on basing design decisions on a handful of strict breakpoints, make sure you consider the vast fragmentation of screen sizes and browser viewports.
Tags:
#webdev
Saved
on: 2023-08-22
htmx ~ Locality of Behaviour (LoB)
Carson Gross explores the Locality of Behaviour (LoB) principle, which emphasizes making the behavior of code units obvious on inspection to enhance maintainability. He discusses the tradeoffs between LoB and other software design principles like DRY and SoC, offering insights on balancing clarity, abstraction, and maintainability in modern development.
Saved
on: 2023-08-16
Build your own web framework - Vercel
Build your own web framework that deploys to edge and serverless infrastructure.
Saved
on: 2022-07-30
SPA Alternative
In this essay, Carson Gross explores alternatives to Single Page Applications (SPAs), advocating for an 'HTML-Centric' development approach. He highlights the drawbacks of SPA complexity and the benefits of embracing HTML as the core medium for web development, offering a simpler, more efficient way to build applications without sacrificing interactivity. Carson discusses how tools like htmx enhance HTML's capabilities and encourages developers to reconsider the dominant SPA paradigm with technical bravery.
Saved
on: 2022-07-20
SPAs: theory versus practice | Read the Tea Leaves
I’ve been thinking a lot recently about Single-Page Apps (SPAs) and Multi-Page Apps (MPAs). I’ve been thinking about how MPAs have improved over the years, and where SPAs still have an …
Saved
on: 2022-06-28
Making the world’s fastest website, and other mistakes - DEV Community
Crazed developer attempts real ecommerce without front-end JavaScript to prove that y’all playin’
Saved
on: 2022-06-09
Magical SVG Techniques — Smashing Magazine
SVGs are scalable, flexible, and, most importantly, lightweight. And, well, they have even more to offer than you might think. Smart SVG techniques, from generative SVG grids to SVG paths with masks, grainy SVG gradients, cut-out effects and fractional SVG stars. Let’s look at some magical SVG techniques that you can use right away.
Saved
on: 2022-05-27
IndigoStack
Indigo — the native macOS app which will revolutionise the way you configure and run local web servers on your Mac.
Saved
on: 2022-05-24
Setting Up CloudFront to Host Your Web App | CSS-Tricks - CSS-Tricks
Let's walk through how to CloudFront can be used to host an entire web app and have it forward non-cacheable requests to our web server.
Tags:
#webdev
Saved
on: 2022-04-29
Super — Build websites with Notion
Create a custom website in less than a minute with instant page loads, SEO optimization, and customized theming. All your content is kept and managed in Notion so you can focus on creating while Super handles the rest.
Saved
on: 2022-04-05
Shoelace: A forward-thinking library of web components.
Hand-crafted custom elements for any occasion.
Saved
on: 2022-04-04
Web Designer & Developer Toolkit by Addy Codes – Curated tools & resources
Discover hundreds of web design & development resources in this carefully curated collection.
Saved
on: 2022-03-21
Google Tag Manager, la nouvelle arme anti adblock
Un blog sur le capitalisme de surveillance, avec un zoom sur le tracking publicitaire
Tags:
#webdev
Saved
on: 2022-02-21
Munter/subfont: Command line tool to optimize your webfont loading. Aggress
Command line tool to optimize your webfont loading. Aggressive subsetting based on your font use, self-hosting of Google fonts and preloading - Munter/subfont
Saved
on: 2022-02-18
A guide to designing accessible, WCAG-conformant focus indicators
— The personal website of Sara Soueidan, inclusive Web UI engineer
Saved
on: 2021-11-07
Developer Tools secrets that shouldn’t be secrets | Christian Heilmann
Tags:
#webdev
Saved
on: 2021-11-02
Best practices for using third-party embeds
This document discusses performance best practices that you can use when loading third-party embeds, efficient loading techniques and the Layout Shift Terminator tool that helps reduce layout shifts for popular embeds.
Tags:
#webdev
Saved
on: 2021-10-18
A Complete Guide To Accessibility Tooling — Smashing Magazine
In a new short series of posts, we highlight some of the useful tools and techniques for developers and designers. Recently we’ve covered HTML Emails and SVG Generators. This time we look into different kinds of tools to help you streamline your accessibility testing process. Don’t miss the next one.
Saved
on: 2021-06-17
wickedblocks
A collection of hundreds of fully responsive Talwind blocks & components. Ready to copy-paste into your Tailwind project.
Saved
on: 2021-05-25
Links on Performance | CSS-Tricks
Making GitHub’s new homepage fast and performant — Tobias Ahlin describes how the scrolling effects are done more performantly thanks to IntersectionObserver
Saved
on: 2021-05-25
Lightning-Fast Web Performance: an online lecture series from Scott Jehl
An online lecture course by Scott Jehl.
Saved
on: 2021-05-20
DOM Events
A visualizer to help you learn how the DOM Event system works through exploration
Tags:
#webdev
Saved
on: 2021-05-19
HTML Tips
In this article I’ll share some tips and advice about HTML.
Tags:
#webdev
Saved
on: 2021-05-06
Getting my blog ready for Core Web Vitals & Page Experience - Paul Bakaus'
Saved
on: 2021-04-24
Tiptap
A suite of open source content editing and real-time collaboration tools for developers building apps like Notion or Google Docs.
Saved
on: 2021-04-23
HTTPWTF
HTTP is fundamental to modern development, from frontend to backend to mobile. But like any widespread mature standard, it's got some funky skeletons in the...
Tags:
#webdev
Saved
on: 2021-03-04
Material Symbols and Icons - Google Fonts
Material Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants.
Tags:
#webdev
Saved
on: 2021-03-03
The great SameSite confusion
In this post, I dissect a common misconception about the SameSite cookie attribute and I explore its potential impact on Web security.
TL;DR ¶ The SameSite cookie attribute is not well understood. Conflating site and origin is a common but harmful mistake. The concept of site is more difficult to apprehend than meets the eye. Some requests are cross-origin but same-site. SameSite only has effects on cross-site requests. SameSite paints a target on your subdomains’ back. Misguided practitioners may unduly eschew SameSite=Strict. The advent of SameSite ¶ You undoubtedly have heard of the SameSite cookie attribute. It made headlines when, in February 2020, Chrome started rolling out changes to SameSite’s default behaviour. Intended as a defence-in-depth mechanism against cross-site attacks, such as cross-site request forgery (CSRF) and cross-site script inclusion (XSSI), SameSite had been lying dormant at the heart of implementing browsers since its inception in 2016.
Saved
on: 2021-02-05
7 bite-sized tips for reliable web automation and scraping selectors
If you’re like most developers, you’ve probably encountered Cascading Style Sheet (CSS) selectors for styling webpages. For example, the following CSS rule combines a paragraph element selector p…
Tags:
#webdev
Saved
on: 2021-02-02
Sign-in form best practices
Use cross-platform browser features to build sign-in forms that are secure, accessible and easy to use.
Tags:
#webdev
Saved
on: 2021-01-25
React Authentication: How to Store JWT in a Cookie | by Ryan Chenkie | Medi
If that’s the case, there’s a decent chance that your API is secured somehow. Maybe you’re making authentication and authorization happen with JSON Web Tokens. If so, there’s also a decent chance…
Saved
on: 2021-01-22
How We Improved SmashingMag Performance — Smashing Magazine
In this article, we’ll take a close look at some of the changes we made on this very site — running on JAMStack with React — to optimize the web performance and improve the Core Web Vitals metrics. With some of the mistakes we’ve made, and some of the unexpected changes that helped boost all the metrics across the board. Hopefully, this little case-study will be useful to you, and perhaps there are one or two techniques that you might be able to apply to your project right away. In the end, performance is all about a sum of all the fine little details, that, when added up, make or break your customer’s experience.
Saved
on: 2021-01-22
Maximally optimizing image loading for the web in 2021
In this post I'll outline 8 image loading optimization techniques to minimize both the bandwidth used for loading images on the web and the...
Saved
on: 2021-01-20
You want overflow: auto, not overflow: scroll | Kilian Valkhof
Every now and then a web developer using a Mac discovers that their beautiful design is littered with scroll bars on other platforms. Either because someone points it out to them or because they attach a mouse to their mac which makes scroll bars appear. Often, MacOS hiding scroll bars by default is blamed for
Saved
on: 2021-01-07
How to Favicon in 2021: Six files that fit most needs — Martian Chronicles,
Prefer SVG over PNG, trust browsers to downscale, drop obscure formats—the ultimate, exhaustive guide to favicons for modern web. Includes steps for static HTML and Webpack.
Tags:
#webdev
Saved
on: 2020-12-23
Polypane, the perfect browser for web developers and designers
The browser for ambitious web developers. Build better websites in less time with a stand-alone browser that makes your site more responsive, more accessible and faster.
Saved
on: 2020-11-12
Stupid solutions: Live server push without JS
So in my post Is this evil? I covered a way of tracking users with CSS. While thinking about those weird ways of using the web I also started thinking about pushing live data to clients without JS. Or at least maintaining a connection. So WebSockets requires JS. WebRTC requires JS. Even HLS (video streaming), which would otherwise be super cool, with captions for accessibility. But no. Or rather, maybe on Apple platforms. Eh. Not good enough.
Saved
on: 2020-09-29
Workers Durable Objects Beta: A New Approach to Stateful Serverless
Durable Objects provide a truly serverless approach to storage and state: consistent, low-latency, distributed, yet effortless to maintain and scale. They also enable coordination and real-time collaboration between clients.
Saved
on: 2020-09-29
The Ultimate Guide to Web Performance 🚀
There's so many ways to speed up your site. Don't you wish every web performance tip was in one place...
Saved
on: 2020-09-25
How I Redesigned My Laravel Blog (Again) - Christoph Rumpel
Every few years, I feel the pressure to redesign my blog. Design trends change fast, and so does my taste. Once I don't like my site anymore, I cannot let go. I need to work on a new redesign. This article is about the latest redesign of my Laravel blog.
Saved
on: 2020-09-17
Tailwind CSS Resources you wish you had.
Background story This week I decided to take a look at Tailwind CSS and create a simple e-...
Saved
on: 2020-09-16
State of Self-Serve Website Building in 2020
The landscape has changed for self-serve business website design and hosting. Our review of three most practical DIY approaches, suitable for a simple static website up-to a full Content Management System (CMS).
Tags:
#webdev
Saved
on: 2020-09-11
A high-performance blog template for 11ty
I'm excited to announce the beta-release of eleventy-high-performance-blog–a high-performance blog template for 11ty based on this very...
Saved
on: 2020-09-07
Blade UI Kit
A set of renderless components to utilise in your Laravel Blade views. Built for the TALL stack. Completely open-source.
Saved
on: 2020-09-03
Legacy to Laravel: How to Modernize an Aging PHP Application | Tighten
Many of our clients have legacy PHP apps and want to move to Laravel. We’re often asked "should we rewrite or refactor?" While full rewrites are appealing, they’re also risky. Here’s our approach to gradually refactoring legacy code that lets you start using Laravel right away.
Saved
on: 2020-09-02
Caching is hard, draw me a picture | APIs You Won't Hate - A community that
Another guest post from our friend Darrel Miller.
This is my attempt to make the HTTPbis caching rules more accessible and hopefully shine a light on how powerful HTTP caching can be.
I’ve been working on a Pluralsight course that talks about how to use the Microsoft HttpClient library. One of the areas I cover is how to take advantage of HTTP caching. In the process I have been doing quite a bit of reading of the HTTPbis spec document on caching. It isn’t the easiest of specifications to re
Tags:
#webdev
Saved
on: 2020-09-01
How to Use AVIF: The New Next-Gen Image Compression Format — Lightspeed
How to Use AVIF: The New Next-Gen Image Compression Format August 5, 2020 Dan Klammer Performance Designer Dan Klammer (@danklammer) on Twitter November 2, 2021 Update: Firefox 93 now supports the...
Tags:
#webdev
Saved
on: 2020-08-24
Learn Playwright & Checkly - Browser Automation
Learn more about Playwright automation & monitoring with Checkly. Explore how to automate your web with a reliable, programmable monitoring workflow.
Tags:
#webdev
Saved
on: 2020-08-19
Chrome Music Lab
Music is for everyone. Play with simple experiments that let anyone, of any age, explore how music works.
Saved
on: 2020-08-05
Pagination and Scroll Restoration with Turbolinks · Gray Matter
a blog by gray kemmey on (mostly programming) matter
Tags:
#webdev
Saved
on: 2020-07-23
How OAuth 2.0 Works
OAuth provides third party applications limited access to user resources without compromising the user's data. Find out exactly how in this blog.
Saved
on: 2020-07-16
Nodesign.dev | Design less develop more.
The ultimate collections of illustrations, art, pictures, fonts, images, icons, css frameworks, favicon generators, color palettes, backgound generators, ui inspirations and many more nodesign tools.
Tags:
#webdev
Saved
on: 2020-06-08
Throttling and Debouncing. Avoiding unnecessary API calls. - DEV Community
The problem There are sometimes that we need to perform actions on certain events controll...
Saved
on: 2020-04-08
HTML DOM - Common tasks of managing HTML DOM with vanilla JavaScript
Saved
on: 2020-04-02
Pavithra Kodmad su Twitter: "Hey twitter friends, can you link me to articl
Hey twitter friends, can you link me to articles in the frontend and web dev space that are timeless and changed your perspective in some way. It maybe a gist, a readme, a tutorial or even a video. Looking to read some good content.
RT for reach? 🙌
Tags:
#webdev
Saved
on: 2020-01-23
UnDraw: Open-source illustrations for every project you can imagine and create | Hacker News
Saved
on: 2019-12-23
Developers: Get Ready for New SameSite=None; Secure Cookie Settings
UPDATE (10/28/2019): We've revised the 2nd and 3rd bullet points in the section "How to Prepare; Known Complexities" below. In May, Chrome ...
Saved
on: 2019-10-24
🤯 HEAD - A simple guide to HTML elements
A simple guide to HTML elements
Tags:
#webdev
Saved
on: 2019-10-01
Menus with "Dynamic Hit Areas" | CSS-Tricks
Flyout menus! The second you need to implement a menu that uses a hover event to display more menu items, you're in tricky territory. For one, they should
Saved
on: 2019-09-24
Why is modern web development so complicated? A long yet hasty explanation:
Modern frontend web development is a polarizing experience: many love it, others despise it. I am a huge fan of modern web development, though I would describe it as “magical” — a…
Tags:
#webdev
Saved
on: 2019-08-08
The CSS background-image property as an anti-pattern
The CSS background-image property allowed us to do some amazing things, but in most cases, it's time to leave it behind.
Saved
on: 2019-07-28
Going serverless with Hugo and Netlify - Freek Van der Herten's blog on PHP
Our team releases a lot of open source packages. All of our packages are well documented. For the smaller packages, we use a simple readme on GitHub. The bigger packages, like medialibrary and event projector get documented on our documentation site. We recently moved our site from a Digital Ocean…
Saved
on: 2019-07-18
The Evolution of Spotify Home Architecture
Emily Samuels and Anil Muppalla discuss the evolution of Spotify's architecture that serves recommendations (playlist, albums, etc) on the Home Tab.
Saved
on: 2019-06-19
How to Section Your HTML | CSS-Tricks
The sectioning elements in HTML5 are , , , and . is also kind of a sectioning element since
Saved
on: 2019-06-19
Extract critical CSS | web.dev
Learn how to improve render times with critical CSS technique and how to choose the best tool for your project.
Saved
on: 2019-06-05
Building a stateless API proxy - Thea Flowers
How to make an access-limiting proxy for any API
Saved
on: 2019-05-30
The Sass Ampersand | CSS-Tricks
The & is an extremely useful feature in Sass (and Less). It's used when nesting. It can be a nice time-saver when you know how to use it, or a bit of a
Saved
on: 2019-05-28
HTTP headers for the responsible developer - Twilio
Guide to using HTTP headers for a better web. Learn about HTTPS, HSTS, CSP, Cacheable, immutable resources, serving WebP images, Feature-Policy and more.
Saved
on: 2019-05-08
Uppy 1.0: Your best friend in file uploading — Uppy
Today, after three years of development, we are launching version 1.0 of Uppy,
Saved
on: 2019-04-29
ds160 - Overview
ds160 has 2 repositories available. Follow their code on GitHub.
Saved
on: 2019-04-22
TwirPHP: A modern RPC framework for PHP
In the last couple years RPC started to become popular again as a communication mechanism for web-based APIs. It’s not a new concept at all, but it changed a lot over the years: the technology evolved, new IDLs and frameworks (like protobuf and gRPC) appeared. TwirPHP tries to bring this new tech to PHP by porting Twirp, Twitch’s “simple RPC framework built on protobuf”.
Saved
on: 2019-04-20
How to properly set up ESLint with Prettier for Vue or Nuxt in VSCode
Writing tech tutorials is hard because certain configurations might stop working after several months. As I’m also working on other things I don’t always have time to check if this is still working…
Tags:
#webdev
Saved
on: 2019-04-15
NoCoffee – Vision Simulator for Chrome
Vision problems are more pervasive than most of us realize. Upwards of 285 million people worldwide are visually impaired. Many more have low or moderate visual difficulties. The number in the U.S.…
Saved
on: 2019-04-12
Accessibility Insights
Solve accessibility issues before they reach your customers.
Saved
on: 2019-04-12
dequelabs/axe-core: Accessibility engine for automated Web UI testing
Accessibility engine for automated Web UI testing
Saved
on: 2019-04-12
AddyOsmani.com - Native image lazy-loading for the web!
In this post, we’ll look at the new loading attribute which brings native and
Tags:
#webdev
Saved
on: 2019-04-08
Rich text / HTML editors and frameworks
Rich text / HTML editors and frameworks. GitHub Gist: instantly share code, notes, and snippets.
Saved
on: 2019-04-03
delight-im/PHP-I18N: Internationalization and localization for PHP
Internationalization and localization for PHP
Saved
on: 2019-03-29