What are performance optimization techniques for large Playwright test suites?

// playwright.config.ts
export default defineConfig({
  fullyParallel: true,     // All tests parallel
  workers: process.env.CI
    ? 4
    : Math.floor(require('os').cpus().length / 2), // Half CPU count locally
});

// Login ONCE, reuse for all tests
projects: [
  { name: 'setup', testMatch: '*.setup.ts' },
  {
    name: 'e2e',
    use: { storageState: '.auth/user.json' },
    dependencies: ['setup'],
  },
],

// BAD — UI-based setup is slow
test.beforeEach(async ({ page }) => {
  await page.goto('/products/new');
  await page.fill('#name', 'Test Product');
  await page.fill('#price', '99.99');
  await page.click('#save');
  // 3-5 seconds per test
});

// GOOD — API setup is fast
test.beforeEach(async ({ request }) => {
  await request.post('/api/products', {
    data: { name: 'Test Product', price: 99.99 },
    headers: { Authorization: `Bearer ${process.env.ADMIN_TOKEN}` },
  });
  // 200ms per test
});

// Block analytics, ads, and images to speed up page load
await page.route('**/*.{png,jpg,jpeg,gif,webp,svg}', r => r.abort());
await page.route('**/google-analytics.com/**', r => r.abort());
await page.route('**/hotjar.com/**', r => r.abort());
await page.route('**/facebook.com/**', r => r.abort());

// BAD — networkidle waits for ALL network activity (500ms of silence)
await page.goto('/products', { waitUntil: 'networkidle' }); // Slow

// GOOD — wait for specific element instead
await page.goto('/products');
await page.locator('.product-card').first().waitFor();

// BAD — arbitrary sleep
await page.waitForTimeout(3000);

// GOOD — wait for the actual thing you need
await page.locator('.modal').waitFor({ state: 'hidden' });
await expect(page.locator('.data-loaded')).toBeVisible();

// Use unique data per test to avoid cleanup conflicts
const uniqueEmail = `user-${Date.now()}-${Math.random().toString(36).slice(2)}@test.com`;

// Use a test-specific database schema/namespace
process.env.DB_SCHEMA = `test_${testInfo.workerIndex}`;

strategy:
  matrix:
    shardIndex: [1, 2, 3, 4, 5, 6, 7, 8]
    shardTotal: [8]