Ideal Software Delivery Pipeline: A Three.js Dora Metrics case study

Simple and boring? Nah, that’s not anyone’s vibe anymore. These days, people want dynamic, interactive experiences on their smartphones and websites. And as the demand for mind-blowing visuals grows, the tech geniuses step up to create some serious magic. Remember when 3D graphics were the hot thing? Everyone was obsessed with those interactive, eye-catching visuals. Now we’re talking 4D, 5D, who knows how many more dimensions are coming. But when it comes to 3D, one JavaScript library has always been the MVP: Three.js.

Three.js is an open-source JavaScript library and API that lets developers whip up stunning 2D and 3D graphics, all animated in the browser without the need for plugins, thanks to WebGL.

But honestly, I'm always curious about the behind-the-scenes action of these cool repos.

How do they actually work?

What's their mojo?

You know how when you admire someone, you just want to know everything about them? That's exactly how it is for me. When I stumble upon a cool repo—whether during a chat with friends or while Googling something random—I immediately grab my Middleware OSS and peek through the repo’s engineering pipeline.

What are they doing right?

What are their weak spots?

What can we learn from the mistakes of these top projects?

Three.js: Creating Deployment Utopia

Three.js has scored a hat trick with flawless 166, 160, and 172 deployments in July, August, and September 2024. While others hope for it, they just make it happen!

Their engineering brilliance doesn’t stop there. I took a peek at their lead time, and it’s just as impressive—efficient, streamlined, and setting a high bar for the rest of us.

Let’s see:

July: Lead time was 7.94 hours

August: Lead time was a little higher at 10.36 hours than in July but still below the standard benchmark.

September: They maintained the lead time of 10.01 hours.

Where other repos take days to turnaround their final product, they are doing it within hours.

Their great lead time and deployment frequency are the result of a perfect cycle time. Their cycle time clocked at 6.49 hours, 6.44 hours, and 8.88 hours respectively in the above-mentioned months.

What’s working for them?

Prompt Reviews are one of the winning factors for their quick churn-out times. Having a dedicated team of reviewers like Mugen87, sunag, and donmccurdy helps them ensure PRs are attended to promptly.

For instance: PR #28903 and PR #28821 were merged swiftly, with the former taking less than an hour, thanks to the repository's efficient review process.

Another reason for their seamless workflow is their clear contribution guidelines. They have well-defined guidelines that make it easier for contributors to align their work with repository standards, reducing back-and-forth communications.

Also read: Deno Dora Metrics: Setting the Standard for Deployment Frequency and Lead Time

What’s their Mojo?

Active Contributors: With input from at least 17 contributors at a time, the repository reflects a vibrant, collaborative environment that fosters diverse ideas and teamwork.

Efficient CI/CD Pipelines: They have an effective CI/CD pipeline in place that results in low merge times.

Prompt Reviewer Actions: They have an active community of around 2k contributors who maintain a robust network of active reviewers ensuring quicker PR merges.

Transparent Contribution Guidelines: They have clearly outlined contribution guidelines that minimize delays.

Passionate Repo: I have already analyzed approximately 20-21 repositories under our 100 Open-Source Dora Metrics Case Studies initiative, but Three.js is the only one that spends 70% of their time and effort in feature push that too effectively without any slowdown.

Some of their recently pushed features include the following:

PCFShadowMap Support in WebGPURenderer: PR #28926 by Mugen87

Matrix2 Class Addition: PR #28923 by gkjohnson

Bloom Emissive/Selective Examples: PR #28913 by sunag

They spend a meagre 20% on bug fixes. Why do you think so? Because they stress a lot on rework within the PRs indicating thorough checks and balances and ensuring high-quality merges.

Also read: How the Ruby Repository Masters Fast Merges

Three.js Dora Metrics: Presenting an Ideal Engineering Pipeline for Others to Follow

Team Three.js is doing everything right and pushing out new features like a mean machine.

Key Takeaways: An active and passionate community that truly cares about the product, paired with comprehensive documentation, can significantly enhance your engineering workflow. Plus, if your ultimate goal is to deliver top-notch quality, you've already won half the battle!

If you find these learnings interesting, we’d really encourage you to give a shot at Dora metrics using Middleware Open Source. You could follow this guide to analyze your team or write to our team at productivity@middlewarehq.com with your questions and we’ll be happy to generate a suggestion study for your repo — free!

Also, If you’re excited to explore these insights further and connect with fellow engineering leaders, come join us in The Middle Out Community and subscribe to the newsletter for exclusive case studies and more!

Did you know?

Three.js was created by Ricardo Cabello, also known as Mr. doob, in 2010. It was designed to simplify the process of creating 3D graphics in the browser using WebGL.

Further Resources

Middleware and Dora Metrics

Continuous Integration Guides

Dora Metrics Methodology