<!DOCTYPE html>

Rethinking Code Reviews with Stacked PRs

<br> body {<br> font-family: sans-serif;<br> line-height: 1.6;<br> margin: 0;<br> padding: 0;<br> }</p> <div class="highlight"><pre class="highlight plaintext"><code>h1, h2, h3 { margin-top: 2rem; } code { background-color: #f0f0f0; padding: 0.2rem 0.5rem; border-radius: 3px; font-family: monospace; } img { max-width: 100%; display: block; margin: 1rem auto; } pre { background-color: #f0f0f0; padding: 1rem; border-radius: 3px; overflow-x: auto; } </code></pre></div> <p>

Rethinking Code Reviews with Stacked PRs

Code reviews are a crucial part of the software development process, ensuring code quality, knowledge sharing, and team collaboration. However, traditional code review workflows can be cumbersome and inefficient, especially when dealing with large and complex projects. Enter stacked PRs, a revolutionary approach to code reviews that offers numerous benefits, including faster feedback loops, better code organization, and more effective collaboration.

The Traditional Code Review Workflow

In the traditional code review workflow, developers typically create a single pull request (PR) for every change they make. This approach, while seemingly straightforward, can lead to several issues:

Long feedback cycles:
Reviewers often need to process large amounts of code, leading to delays in feedback and ultimately slowing down the development process.
Difficult to understand context:
Reviewing a single PR with multiple unrelated changes can make it challenging for reviewers to understand the overall context and purpose of the changes.
Fragmented discussions:
Multiple PRs for related changes can result in fragmented discussions, making it harder to track the progress of a feature or bug fix.

Diagram illustrating the traditional and stacked PR workflows

Source: Datadog blog

Stacked PRs: A More Efficient Approach

Stacked PRs, also known as chained PRs, address these challenges by breaking down large changes into smaller, focused PRs that build upon each other. Each PR represents a specific step or change, allowing reviewers to focus on a smaller scope of code and provide more targeted feedback.

Benefits of Stacked PRs:

Faster feedback loops:
Smaller PRs are easier to review, resulting in quicker feedback and faster development cycles.
Improved code quality:
By focusing on smaller, focused changes, reviewers can provide more accurate and relevant feedback, leading to higher code quality.
Better code organization:
Stacked PRs help maintain a clear and logical order of changes, making it easier to understand the evolution of the codebase.
Reduced cognitive load:
Reviewing smaller PRs reduces the cognitive load on reviewers, allowing them to provide more effective feedback.
Easier to track progress:
With each PR representing a specific step, it becomes simpler to track the progress of a feature or bug fix.

How to Implement Stacked PRs

Implementing stacked PRs requires a shift in mindset and workflow. Here's a step-by-step guide to help you get started:

Plan and Break Down Changes

Before starting to code, carefully plan the changes you need to make. Break down the larger task into smaller, independent chunks that can be implemented and reviewed separately.

Create the First PR

Create the first PR, focusing on a single, small change. This initial PR should be self-contained and easy to understand. You might use a descriptive title like "Feature: Add User Authentication - Part 1: Basic Authentication Implementation."

Get Feedback and Make Changes

Once the first PR is submitted, your team can provide feedback. Address any comments or suggestions and make necessary changes before merging the PR. The key here is to ensure the first PR is stable and well-tested before moving on to the next one.

Create Subsequent PRs

Once the first PR is merged, create the next PR building upon the previous one. Each subsequent PR should depend on the changes made in the previous PR. For example, a second PR could be titled "Feature: Add User Authentication - Part 2: Password Hashing Implementation" and would depend on the basic authentication implementation established in the first PR.

Repeat the Process

Continue creating and reviewing PRs, building upon the changes made in previous PRs, until the entire feature or bug fix is complete. This iterative process ensures that each change is carefully reviewed and integrated into the codebase.

Best Practices for Stacked PRs

While stacked PRs offer many advantages, adopting them effectively requires following some best practices:

Clear Communication: Ensure clear communication between developers and reviewers regarding the breakdown of changes and the dependencies between PRs.
Descriptive PR Titles: Use informative PR titles that clearly indicate the purpose of each PR and its relation to other PRs in the stack.
Small, Focused PRs: Ensure that each PR addresses a single, well-defined change, avoiding mixing unrelated changes into a single PR.
Testing: Test each PR thoroughly to ensure that it integrates seamlessly with the existing codebase and does not introduce any regressions.
Clear Dependencies: Define clear dependencies between PRs, ensuring that the correct order is followed during review and merging.
Review and Merge Order: Prioritize reviewing and merging PRs in the order they were created to maintain a consistent workflow.
Use of Branching Strategies: Utilize appropriate branching strategies like "feature branches" to isolate changes and simplify the management of stacked PRs.
Tool Support: Leverage tools like GitHub, GitLab, or Bitbucket, which offer features like "draft PRs" and "dependent PRs" to streamline the process.

Tools for Stacked PRs

Several tools and platforms can assist in implementing and managing stacked PRs:

GitHub: Offers features like "dependent PRs" and "draft PRs" to help manage the flow of stacked PRs.
GitLab: Provides similar features to GitHub, including support for draft PRs and dependent PRs.
Bitbucket: Supports stacked PRs through its branching and merging features, allowing for the creation of dependent PRs.
Azure DevOps: Offers capabilities for managing stacked PRs through its branch policies and pull request workflows.

Example: Implementing a New Feature with Stacked PRs

Let's consider an example of implementing a "user registration" feature using stacked PRs on GitHub:

PR 1: Create the User Model

Title: "Feature: User Registration - Part 1: Create User Model"
Description: "Creates the basic user model with necessary attributes."

Changes:

    // models/User.js
    const mongoose = require('mongoose');

    const userSchema = new mongoose.Schema({
      username: { type: String, required: true, unique: true },
      email: { type: String, required: true, unique: true },
      password: { type: String, required: true },
    });

    const User = mongoose.model('User', userSchema);

    module.exports = User;

PR 2: Implement User Registration Form

Title: "Feature: User Registration - Part 2: Implement Registration Form"
Description: "Adds a registration form on the frontend with fields for username, email, and password."

Changes:

    // components/RegistrationForm.js
    import React, { useState } from 'react';

    const RegistrationForm = () => {
      const [username, setUsername] = useState('');
      const [email, setEmail] = useState('');
      const [password, setPassword] = useState('');

      const handleSubmit = (event) => {
        event.preventDefault();
        // Submit registration data to the backend
      };

      return (

{/* Form fields for username, email, and password */} Register ); }; export default RegistrationForm;

PR 3: Handle Registration Submission

Title: "Feature: User Registration - Part 3: Handle Registration Submission"
Description: "Handles registration form submission on the backend and creates a new user in the database."

Changes:

    // routes/auth.js
    const express = require('express');
    const router = express.Router();
    const User = require('../models/User');

    router.post('/register', async (req, res) => {
      try {
        const { username, email, password } = req.body;
        const newUser = new User({ username, email, password });
        await newUser.save();
        res.status(201).json({ message: 'User registered successfully' });
      } catch (error) {
        res.status(500).json({ message: error.message });
      }
    });

    module.exports = router;

By breaking down the "user registration" feature into these smaller, focused PRs, reviewers can easily understand each step and provide more accurate feedback. This approach also ensures that the entire feature is implemented in a modular and maintainable way.

Conclusion

Rethinking code reviews with stacked PRs can significantly enhance the efficiency and effectiveness of the software development process. By breaking down large changes into smaller, manageable units, developers and reviewers can collaborate more effectively, resulting in faster feedback loops, better code quality, and improved team productivity. While adopting stacked PRs requires a shift in mindset and workflow, the benefits it offers are undeniable.

Remember to embrace best practices like clear communication, descriptive titles, and thorough testing to maximize the effectiveness of stacked PRs. Additionally, leverage the power of tools like GitHub, GitLab, or Bitbucket to simplify the process and improve team collaboration.

By embracing stacked PRs, teams can revolutionize their code review process, leading to faster development cycles, higher code quality, and a more collaborative development experience.