Building a Web Performance Culture in Your Team

The fastest websites aren't built by performance engineers alone — they're built by teams where everyone considers performance in their daily work. Here's how to build that culture.

Why Performance Culture Matters

Without a performance culture:

• Developers add features without measuring impact
• Designers create layouts that require heavy JavaScript
• Marketing adds tracking scripts without telling engineering
• Product managers don't include performance in acceptance criteria
• Performance degrades 5-10% per quarter

With a performance culture:

• Performance is considered at design time
• New features include performance budgets
• Third-party scripts require approval
• Regressions are caught in CI/CD
• Performance improves or stays stable over time

Step 1: Make Performance Visible

Dashboard on a TV

Put a performance dashboard on a wall-mounted monitor:

• Current Lighthouse scores for top pages
• Core Web Vitals trends (weekly)
• Performance budget status (green/yellow/red)
• Competitor comparison

When the team sees performance data every day, it becomes part of the conversation.

Weekly Performance Report

Send a brief weekly email or Slack message:

📊 Weekly Performance Report

Homepage: 78 → 75 (⬇️ -3)  
Pricing: 82 → 84 (⬆️ +2)
Blog: 71 → 71 (➡️ unchanged)

⚠️ Homepage regression likely caused by new carousel (PR #234)

Step 2: Set Performance Budgets

Performance budgets are hard limits that trigger alerts:

Metric	Budget	Action if Exceeded
Total JS	<200KB	Block deploy
Total CSS	<80KB	Warning
Page weight	<1.5MB	Block deploy
LCP	<2.5s	Warning
CLS	<0.1	Block deploy
Lighthouse mobile	>70	Warning

Enforce in CI/CD

# GitHub Actions - Lighthouse CI
- name: Lighthouse CI
  run: |
    npm install -g @lhci/cli
    lhci autorun --assert.preset=lighthouse:recommended
    lhci assert --budgets-file=budgets.json

Step 3: Involve Every Role

Designers

• Use system fonts or limited custom fonts (2 families max)
• Design with realistic image sizes in mind
• Consider animation cost (prefer CSS transitions)
• Create mobile-first layouts (simpler = faster)
• Avoid complex layout patterns that cause CLS

Product Managers

• Include performance criteria in user stories
• Ask "What's the performance impact?" in planning
• Prioritize performance fixes alongside features
• Track performance as a product KPI

Marketing

• Require approval before adding third-party scripts
• Provide a "script budget" — total third-party JS allowed
• Use lighter analytics alternatives when possible
• Optimize landing page images before upload

Developers

• Run Lighthouse before opening PRs
• Use bundle analyzer to check impact of new dependencies
• Implement lazy loading by default for below-fold content
• Review network waterfall after each feature

Step 4: Create Performance Champions

Designate one person per team as a "performance champion":

• Reviews PRs for performance impact
• Runs monthly audits
• Shares performance tips in team channels
• Escalates regressions
• Attends performance working group meetings

Step 5: Celebrate Wins

Performance improvements deserve recognition:

• "🚀 Sarah improved the checkout page from 42 to 78 this sprint!"
• Monthly "Performance Hero" shoutout
• Track cumulative improvement in team retrospectives
• Share business impact when possible ("Our speed improvement contributed to a 12% conversion increase")

Step 6: Learn from Regressions

When performance drops:

1. No blame — focus on the system that allowed it
2. Root cause analysis — what changed?
3. Prevention — how do we catch this earlier?
4. Documentation — add to team runbook

Common Cultural Blockers

Blocker	Solution
"Performance isn't in our OKRs"	Add it as a team-level metric
"We don't have time"	Quick wins take 1-2 hours, not sprints
"Users don't complain"	Users leave silently — check bounce rate
"It's the platform's fault"	Most issues are in your code, not the platform
"We'll optimize later"	"Later" never comes — optimize as you build

Measure Your Culture

Signs of a healthy performance culture:

• Performance budgets exist and are enforced
• PRs include performance impact notes
• Weekly performance metrics are shared
• Regressions are caught before production
• Non-engineering roles consider performance
• Performance is in team OKRs or KPIs

Start with Visibility

You can't build a culture around something you can't see. BadPageSpeed gives your entire team performance visibility.

Get team visibility →