Keeping Developers Happy with a Fast CI - Shopify
How Shopify’s Test Infrastructure team was able to reduce the p95 of Shopify’s core monolith CI from 45 minutes to 18.
Material Design Text Fields Are Badly Designed — Smashing Magazine
Where to put the label in a web form? In the early days, we talked about left-aligned labels versus top-aligned labels. These days we talk about floating labels. Let’s explore why they aren’t a very good idea, and what to use instead. Some people assume float labels are best because Google’s Material Design uses them. But in this case, Adam Silver recommends using conventional text fields which ha
Hiding Content Responsibly
We've covered the idea of hiding things in CSS many times here, the most recent post being Marko Ilic's "Comparing Various Ways to Hide Things in CSS" which
React Component Tests for Humans
React component tests should be interesting, straightforward, and easy for a human to build and maintain.
What's the Backup Plan for Your WordPress Site?
Of all the reasons we love and use Jetpack for CSS-Tricks—a poster child WordPress site—is that we can sleep easy at night knowing we have real-time backups
PostgreSQL: How to write a trigger
UPDATED 2023: A trigger is a way to automatically respond to events. This is a tutorial on how to manage and program triggers in PostgreSQL.
Dr. Bernice King on how technology can transform the Black economy
As technology transforms the global economy, Dr. Bernice King, the CEO of the King Center for Nonviolent Social Change, is striving to make sure these new economic opportunities are available…
Open source in the 5G stack
Developers know the value of openness, and increasingly policymakers are taking note. Open source and open standards approaches offer promising solutions to mounting policy problems related to digital sovereignty. One…
Mitigating the effects of silent data corruption at scale
What the research is: Silent data corruption, or data errors that go undetected by the larger system, is a widespread problem for large-scale infrastructure systems. This type of corruption can propagate across the stack and manifest as application-level problems. It can also result in data loss and require months to debug and resolve. This work […]
Before You memo()
Rendering optimizations that come naturally.
Create Responsive Image Effects With CSS Gradients And aspect-ratio — Smashing Magazine
A classic problem in CSS is maintaining the aspect ratio of images across related components, such as cards. The newly supported `aspect-ratio` property in combination with `object-fit` provides a remedy to this headache of the past! In this article, Stephanie Eckles will show you how to use these properties, in addition to creating a responsive gradient image effect for extra flair.
Visualize Team Usage With Sophisticated Usage Dashboard
Learn more about how Vercel's latest feature will give access to usage information so your Team can optimize your builds.
Getting Deep Into Shadows
Let’s talk shadows in web design. Shadows add texture, perspective, and emphasize the dimensions of objects. In web design, using light and shadow can add
What The Heck, z-index??
The z-index property can be a tricky little bugger. Sometimes, no matter how much you crank up the number, the element never rises to the top! In this article, we explore stacking contexts, and see how they can thwart our efforts to use z-index. We'll also learn how to use this mechanism to our advantage.
FOQS: Scaling a distributed priority queue
We will be hosting a talk about our work on Scaling a Distributed Priority Queue during our virtual Systems @Scale event at 11 am PT on Wednesday, February 24, followed by a live Q&A session. Please submit any questions to [email protected] before the event. The entire Facebook ecosystem is powered by thousands of distributed systems […]
An incomplete list of complaints about real code
Read Consistency with Database Replicas - Shopify
At Shopify, we’ve long used database replication for redundancy and failure recovery, but only fairly recently started to explore the potential of replicas as an alternative read-only data source for applications.
State Of GDPR In 2021: Key Updates And What They Mean — Smashing Magazine
As digital practitioners, GDPR has impacted every facet of our professional and personal lives. Whether you’re addicted to Instagram, message your family on WhatsApp, buy products from Etsy or Google information, no one has escaped the rules that were introduced in 2018.
Using HPKE to Encrypt Request Payloads
Allowing users to securely log parts of the request that match firewall rules while making it impossible for anyone else to decrypt.
Clipping Scrollable Areas On The inline-start Side
On a default left-to-right web page, "hanging" an element off the right side of the page (e.g. position: absolute; right: -100px;) triggers a horizontal
Three Ways to Blob with CSS and SVG
Blobs are the smooth, random, jelly-like shapes that have a whimsical quality and are just plain fun. They can be used as illustration elements and background
Your guide to Developer Experience Week at GitHub InFocus
This year we hosted our first all-virtual GitHub Universe—and you tuned in to join us from 174 regions around the world! We knew there was even more to cover, so…
MLH Fellowship, powered by GitHub, welcomes American Express and Adobe to the Summer 2021 Program
Students crave hands-on experience, and companies look for developers who can contribute to existing projects. As the home to the world’s largest community of developers, we have the great responsibility…
Engineering dependability and fault tolerance in a distributed system - High Scalability -
This is a guest post by Paddy Byers, Co-founder and CTO at Ably, a realtime data delivery platform. You can view the original article on Ably's blog. Users need to know that they can depend on the service that is provided to them. In practice, because from time to time individual elements will inevitably fail, this means you have to be able to continue in spite of those failures. In this article,
Unfortunate things about performance reviews
Building Your Own Personal Learning Curriculum — Smashing Magazine
As developers, we’re constantly learning new languages and frameworks. But how can you structure this learning to ensure maximum benefit while still progressing? Here’s how you can devise your own curriculum to keep moving in the right direction. The following are simply steps that worked for Kirsty Simmonds when she needed to learn over time, without burning out or placing undue pressure on mysel
Introducing: Smarter Tiered Cache Topology Generation
Announcing a fundamental improvement to Argo Tiered Cache we’re calling Smart Tiered Cache Topology. When enabled, Argo Tiered Cache will now dynamically select the single best upper tier for each of your website’s origins while providing tiered cache analytics.
Mistakes I've Made as an Engineering Manager
I’ve been a manager for many years at companies of different scale. Through these experiences, I’ve done my share of learning, and made some mistakes along
Barebones CSS for Fluid Images
Zach takes a look at some fundamental HTML+CSS usage for fluid, responsive images. Most of it, I'd say, is what you'd expect, but things get weird when srcset
Let’s Create a Custom Audio Player
HTML has a built-in native audio player interface that we get simply using the <audio> element. Point it to a sound file and that’s all there is to it.
PostgreSQL: CREATE STATISTICS - advanced query optimization
The PostgreSQL query planner doesn't know which data usually correlates. How to use CREATE STATISTICS to find correlations.
Listify a JavaScript Array
Make a human readable list from an array in JavaScript.
Shadow Jobs
We take developer productivity pretty seriously at Slack. It’s multi-faceted, spreading across build speed, reliability, modernity, and more. One thing we really pride ourselves in is using the latest build tools when possible. Not necessarily bleeding edge (alphas, betas, RC, etc.), but the latest stable versions. Aside from the new features and improvements they bring,…
Context And Variables In The Hugo Static Site Generator — Smashing Magazine
In this article, we take a look at the topic of context and variables in Hugo, a popular static site generator. You’ll understand concepts such as the global context, flow control, and variables in Hugo templates, as well as data flow from content files through templates to partials and base templates.
Use CSS Clamp to create a more flexible wrapper utility
I like Andy's idea here:
Introducing GitHub Campus TV!
We’re thrilled to announce the launch of GitHub Campus TV! With new shows every week, tune in to hear from experts, participate in workshops, and join a community of passionate…
Benchmark (YCSB) numbers for Redis, MongoDB, Couchbase2, Yugabyte and BangDB - High Scalability -
This is guest post by Sachin Sinha who is passionate about data, analytics and machine learning at scale. Author & founder of BangDB. This article is to simply report the YCSB bench test results in detail for five NoSQL databases namely Redis, MongoDB, Couchbase, Yugabyte and BangDB and compare the result side by side. I have used latest versions for each NoSQL DB and have followed the recommendat
Faster, more efficient systems for finding and fixing regressions
Every workday, Facebook engineers commit thousands of diffs (which is a change consisting of one or more files) into production. This code velocity allows us to rapidly ship new features, deliver bug fixes and optimizations, and run experiments. However, a natural downside to moving quickly in any industry is the risk of inadvertently causing regressions […]
How to Create a Shrinking Header on Scroll Without JavaScript
Imagine a header of a website that is nice and thick, with plenty of padding on top and bottom of the content. As you scroll down, it shrinks up on itself,
PostgreSQL: ANALYZE and optimizer statistics
To find the best execution plan PostgreSQL is relying on statistics to give the optimizer an indication of what to expect.
GitHub Enterprise Server 3.0 is now generally available
Today we’re announcing general availability of GitHub Enterprise Server 3.0. Introduced during the GitHub Universe 2020 keynote, it’s the biggest ever change to Enterprise Server. Every company using GitHub can…
Bound to Round: 8 Tips for Dealing with Hanging Pennies - Shopify
We want to avoid having many hanging pennies. And when faced with such a situation, we want to identify such calculations and put a plan in place on who to notify and what to do with them.
DevTools Debugging Tips And Shortcuts (Chrome, Firefox, Edge) — Smashing Magazine
DevTools is very advanced and helpful, but can also be very intimidating and overwhelming. Let’s fix that. In this article, Vitaly reviews useful features and shortcuts for debugging in Chrome, Firefox, Edge and Safari.
Vercel & Next.js Experts Help Teams Build the Next Big Thing
Learn more about how to collaborate, build, and succeed with one of Vercel's Agency Experts, or become an Agency Expert today.
Beautiful accessibility with Floating Focus
Imagine if your :focus styles animated from element to element as you tab through a site. Like the focus ring up and flew across the page to the next element.
Optimizing Video For Size And Quality — Smashing Magazine
Adding video to your application can increase customer engagement and satisfaction. But the exact opposite can occur when there are issues with the video playback: video stalls are frustrating and drive customers away. In this article, Doug Sillars will walk you through the steps to optimize the video on your website to ensure fast playback and reduce stalls.
Things To Expect From A Smashing Workshop: Form Design Masterclass — Smashing Magazine
A couple of weeks ago, we organized a [Form Design Masterclass](https://smashingconf.com/online-workshops/workshops/adam-silver), an online workshop with Adam Silver alongside 81 friendly and smart people. Today, Adam Silver shares his experience and details by highlighting what you as an attendee can expect from a Smashing Workshop, and things to keep in mind when running one.
Weekly Platform News: WebKit autofill, Using Cursor Pointer, Delaying Autoplay Videos
In this week's roundup, WebKit's prefixed autofill becomes a standard, the pointer cursor is for more than just links, and browsers are jumping on board to
Don’t put pointer-events: none on form labels
Bruce Lawson with the tip of the day, warning against the use of pointer-events: none on forms labels. We know that pointer-events is used to change how
Avoiding npm substitution attacks
Supply chain attacks are a reality in modern software development. Thankfully, you can reduce the attack surface by taking precautions and being thoughtful about how you manage your dependencies. We…
Using Betas to Deploy New Features Safely - Shopify
For companies like Shopify that practice continuous deployment, our code is changing multiple times every day. We have to de-risk new features to ship safely and confidently without impacting the million+ merchants using our platform. Beta flags are one approach to feature development that gives us a number of notable advantages.
What Saul Bass Can Teach Us About Web Design — Smashing Magazine
Saul Bass is a graphic design legend. Responsible for title sequences in films like North by Northwest and Anatomy of a Murder, as well as a number of iconic posters and brand logos over the years. His work, in the words of Martin Scorsese, “distilled the poetry of the modern, industrialized world.” Film credits, brand logos, posters… Saul did it all, and the principles that informed his work are
WordPress 5.7: Big ol' jQuery Update
WordPress core is making the jump from jQuery 1.12.4 to jQuery 3.5.1! This is a big deal for lots of reasons — like modern features, better DX, and security
Progressive Web Apps in 2021
Maximiliano Firtman has a look at PWAs this year, including trying to get a bead on how widespread they are:
How to Build a GraphQL API for Text Analytics with Python, Flask and Fauna
GraphQL is a query language and server-side runtime environment for building APIs. It can also be considered as the syntax that you write in order to
iframe feedback
What if an <iframe> had within it another <iframe> of the exact same source? Inception, as they say. Baptise Crespy does this all-important
"Catchment areas" with PostgreSQL and PostGIS
This article explains how to partition an area of interest spatially: Approximation of customer potential using PostGIS. Catchment areas.
How we designed and wrote the narrative for our homepage
This post is the fifth installment of our five-part series on building GitHub’s new homepage: How our globe is built How we collect and use the data behind the globe…
Building A Web App With React, Redux And Sanity.io — Smashing Magazine
Headless CMS is a powerful and easy way to manage content and access API. Built on React, Sanity.io is a seamless tool for flexible content management. It can be used to build simple to complex applications from the ground up. In this article, Ifeanyi Dike explains how to build a simple listing app with Sanity.io and React. The global states will be managed with Redux and the application will be s
:focus-visible Support Comes to Firefox
Look at that! The :focus-visible pseudo-selector is now supported in Firefox, as of version 85 which shipped yesterday. I had to rush over to the MDN Docs