diff --git a/.cursor/rules/ultracite.mdc b/.cursor/rules/ultracite.mdc new file mode 100644 index 0000000..0b3bf93 --- /dev/null +++ b/.cursor/rules/ultracite.mdc @@ -0,0 +1,227 @@ +--- +description: Ultracite Rules - AI-Ready Formatter and Linter +globs: "**/*.{ts,tsx,js,jsx,json,jsonc,html,vue,svelte,astro,css,yaml,yml,graphql,gql,md,mdx,grit}" +alwaysApply: false +--- + +Avoid `accessKey` attr and distracting els +No `aria-hidden="true"` on focusable els +No ARIA roles, states, props on unsupported els +Use `scope` prop only on `` els +No non-interactive ARIA roles on interactive els +Label els need text and associated input +No event handlers on non-interactive els +No interactive ARIA roles on non-interactive els +No `tabIndex` on non-interactive els +No positive integers on `tabIndex` prop +No `image`, `picture`, or `photo` in img alt props +No explicit role matching implicit role +Valid role attrs on static, visible els w/ click handlers +Use `title` el for `svg` els +Provide meaningful alt text for all els requiring it +Anchors need accessible content +Assign `tabIndex` to non-interactive els w/ `aria-activedescendant` +Include all required ARIA attrs for els w/ ARIA roles +Use valid ARIA props for the el's role +Use `type` attr on `button` els +Make els w/ interactive roles and handlers focusable +Heading els need accessible content +Add `lang` attr to `html` el +Use `title` attr on `iframe` els +Pair `onClick` w/ `onKeyUp`, `onKeyDown`, or `onKeyPress` +Pair `onMouseOver`/`onMouseOut` w/ `onFocus`/`onBlur` +Add caption tracks to audio and video els +Use semantic els vs role attrs +All anchors must be valid and navigable +Use valid, non-abstract ARIA props, roles, states, and values +Use valid values for `autocomplete` attr +Use correct ISO language codes in `lang` attr +Include generic font family in font families +No consecutive spaces in regex literals +Avoid `arguments`, comma op, and primitive type aliases +No empty type params in type aliases and interfaces +Keep fns under Cognitive Complexity limit +Limit nesting depth of `describe()` in tests +No unnecessary boolean casts or callbacks on `flatMap` +Use `for...of` vs `Array.forEach` +No classes w/ only static members +No `this` and `super` in static contexts +No unnecessary catch clauses, ctors, `continue`, escape sequences in regex literals, fragments, labels, or nested blocks +No empty exports +No renaming imports, exports, or destructured assignments to same name +No unnecessary string/template literal concatenation or useless cases in switch stmts, `this` aliasing, or `String.raw` without escape sequences +Use simpler alternatives to ternary ops if possible +No `any` or `unknown` as type constraints or initializing vars to `undefined` +Avoid `void` op +Use arrow fns vs function exprs +Use `Date.now()` for milliseconds since Unix Epoch +Use `.flatMap()` vs `map().flat()` +Use `indexOf`/`lastIndexOf` vs `findIndex`/`findLastIndex` for simple lookups +Use literal property access vs computed property access +Use binary, octal, or hex literals vs `parseInt()` +Use concise optional chains vs chained logical exprs +Use regex literals vs `RegExp` ctor +Use base 10 or underscore separators for number literal object member names +Remove redundant terms from logical exprs +Use `while` loops vs `for` loops if initializer and update aren't needed +No reassigning `const` vars or constant exprs in conditions +No `Math.min`/`Math.max` to clamp values where result is constant +No return values from ctors or setters +No empty character classes in regex literals or destructuring patterns +No `__dirname` and `__filename` in global scope +No calling global object props as fns or declaring fns and `var` accessible outside their block +Instantiate builtins correctly +Use `super()` correctly in classes +Use standard direction values for linear gradient fns +Use valid named grid areas in CSS Grid Layouts +Use `@import` at-rules in valid positions +No vars and params before their decl +Include `var` fn for CSS vars +No `\8` and `\9` escape sequences in strings +No literal numbers that lose precision, configured els, or assigning where both sides are same +Compare string case modifications w/ compliant values +No lexical decls in switch clauses or undeclared vars +No unknown CSS value fns, media feature names, props, pseudo-class/pseudo-element selectors, type selectors, or units +No unmatchable An+B selectors or unreachable code +Call `super()` exactly once before accessing `this` in ctors +No control flow stmts in `finally` blocks +No optional chaining where `undefined` is not allowed +No unused fn params, imports, labels, private class members, or vars +No return values from fns w/ return type `void` +Specify all dependencies correctly in React hooks and names for GraphQL operations +Call React hooks from top level of component fns +Use `isNaN()` when checking for NaN +Use `{ type: "json" }` for JSON module imports +Use radix arg w/ `parseInt()` +Start JSDoc comment lines w/ single asterisk +Move `for` loop counters in right direction +Compare `typeof` exprs to valid values +Include `yield` in generator fns +No importing deprecated exports, duplicate dependencies, or Promises where they're likely a mistake +No non-null assertions after optional chaining or shadowing vars from outer scope +No expr stmts that aren't fn calls or assignments or useless `undefined` +Add `href` attr to `` els and `width`/`height` attrs to `` els +Use consistent arrow fn bodies and either `interface` or `type` consistently +Specify deletion date w/ `@deprecated` directive +Make switch-case stmts exhaustive and limit number of fn params +Sort CSS utility classes +No spread syntax on accumulators, barrel files, `delete` op, dynamic namespace import access, namespace imports, or duplicate polyfills from Polyfill.io +Use `preconnect` attr w/ Google Fonts +Declare regex literals at top level +Add `rel="noopener"` when using `target="_blank"` +No dangerous JSX props +No both `children` and `dangerouslySetInnerHTML` props +No global `eval()` +No callbacks in async tests and hooks, TS enums, exporting imported vars, type annotations for vars initialized w/ literals, magic numbers without named constants, or TS namespaces +No negating `if` conditions when there's an `else` clause, nested ternary exprs, non-null assertions (`!`), reassigning fn params, parameter props in class ctors, specified global var names, importing specified modules, or specified user-defined types +No constants where value is upper-case version of name, template literals without interpolation or special chars, `else` blocks when `if` block breaks early, yoda exprs, or `Array` ctors +Use `String.slice()` vs `String.substr()` and `String.substring()` +Use `as const` vs literal type annotations and `at()` vs integer index access +Follow curly brace conventions +Use `else if` vs nested `if` in `else` clauses and single `if` vs nested `if` clauses +Use `T[]` vs `Array` +Use `new` for all builtins except `String`, `Number`, and `Boolean` +Use consistent accessibility modifiers on class props and methods +Declare object literals consistently +Use `const` for vars only assigned once +Put default and optional fn params last +Include `default` clause in switch stmts +Specify reason arg w/ `@deprecated` directive +Explicitly initialize each enum member value +Use `**` op vs `Math.pow` +Use `export type` and `import type` for types +Use kebab-case, ASCII filenames +Use `for...of` vs `for` loops w/ array index access +Use `<>...` vs `...` +Capitalize all enum values +Place getters and setters for same prop adjacent +Use literal values for all enum members +Use `node:assert/strict` vs `node:assert` +Use `node:` protocol for Node.js builtin modules +Use `Number` props vs global ones +Use numeric separators in numeric literals +Use object spread vs `Object.assign()` for new objects +Mark members `readonly` if never modified outside ctor +No extra closing tags for comps without children +Use assignment op shorthand +Use fn types vs object types w/ call signatures +Add description param to `Symbol()` +Use template literals vs string concatenation +Use `new` when throwing an error +No throwing non-`Error` values +Use `String.trimStart()`/`String.trimEnd()` vs `String.trimLeft()`/`String.trimRight()` +No overload signatures that can be unified +No lower specificity selectors after higher specificity selectors +No `@value` rule in CSS modules +No `alert`, `confirm`, and `prompt` +Use standard constants vs approximated literals +No assigning in exprs +No async fns as Promise executors +No `!` pattern in first position of `files.includes` +No bitwise ops +No reassigning exceptions in catch clauses +No reassigning class members +No inserting comments as text nodes +No comparing against `-0` +No labeled stmts that aren't loops +No `void` type outside generic or return types +No `console` +No TS const enums +No exprs where op doesn't affect value +No control chars in regex literals +No `debugger` +No assigning directly to `document.cookie` +Use `===` and `!==` +No duplicate `@import` rules, case labels, class members, custom props, conditions in if-else-if chains, GraphQL fields, font family names, object keys, fn param names, decl block props, keyframe selectors, or describe hooks +No empty CSS blocks, block stmts, static blocks, or interfaces +No letting vars evolve into `any` type through reassignments +No `any` type +No `export` or `module.exports` in test files +No misusing non-null assertion op (`!`) +No fallthrough in switch clauses +No focused or disabled tests +No reassigning fn decls +No assigning to native objects and read-only global vars +Use `Number.isFinite` and `Number.isNaN` vs global `isFinite` and `isNaN` +No implicit `any` type on var decls +No assigning to imported bindings +No `!important` within keyframe decls +No irregular whitespace chars +No labels that share name w/ var +No chars made w/ multiple code points in char classes +Use `new` and `constructor` properly +Place assertion fns inside `it()` fn calls +No shorthand assign when var appears on both sides +No octal escape sequences in strings +No `Object.prototype` builtins directly +No `quickfix.biome` in editor settings +No redeclaring vars, fns, classes, and types in same scope +No redundant `use strict` +No comparing where both sides are same +No shadowing restricted names +No shorthand props that override related longhand props +No sparse arrays +No template literal placeholder syntax in regular strings +No `then` prop +No `@ts-ignore` directive +No `let` or `var` vars that are read but never assigned +No unknown at-rules +No merging interface and class decls unsafely +No unsafe negation (`!`) +No unnecessary escapes in strings or useless backreferences in regex literals +No `var` +No `with` stmts +No separating overload signatures +Use `await` in async fns +Use correct syntax for ignoring folders in config +Put default clauses in switch stmts last +Pass message value when creating built-in errors +Return value from get methods +Use recommended display strategy w/ Google Fonts +Include `if` stmt in for-in loops +Use `Array.isArray()` vs `instanceof Array` +Return consistent values in iterable callbacks +Use `namespace` keyword vs `module` keyword +Use digits arg w/ `Number#toFixed()` +Use static `Response` methods vs `new Response()` +Use `use strict` directive in script files \ No newline at end of file diff --git a/.gitignore b/.gitignore index 3a70dd7..4460cdc 100644 --- a/.gitignore +++ b/.gitignore @@ -14,6 +14,7 @@ node_modules # Results results.json +benchmarks/**/traces # Testing coverage @@ -42,4 +43,4 @@ yarn-error.log* test-results -playwright-report \ No newline at end of file +.pnpm-store diff --git a/METHODOLOGY.md b/METHODOLOGY.md new file mode 100644 index 0000000..64a7d39 --- /dev/null +++ b/METHODOLOGY.md @@ -0,0 +1,290 @@ +# Benchmark Methodology + +This document explains how CookieBench measures and evaluates cookie banner performance. Our methodology prioritizes transparency, reproducibility, and real-world user experience. + +## Introduction + +CookieBench measures the performance impact of cookie consent solutions on web applications. We focus on metrics that directly impact user experience, following industry standards like Core Web Vitals and Lighthouse. + +## Measurement Approach + +### Dual Banner Timing Modes (DOM Presence vs User-Visible) + +Every benchmark run collects **both** timing modes for the cookie banner: + +**DOM presence time** (technical render): + +- Measures when the banner element first appears in the DOM +- Recorded when the element has dimensions (`width > 0`, `height > 0`) and is not hidden +- Exposed in results as `domPresenceTime` (alias: `bannerRenderTime` / `renderStart`) +- Tracked for reference and displayed alongside user-visible time; **not used for scoring** + +**User-visible time** (opacity-threshold visibility): + +- Measures when the banner becomes visible to users (opacity > 0.5) +- Uses opacity threshold of **0.5** to account for CSS animations and transitions +- Exposed in results as `userVisibleTime` (alias: `bannerVisibilityTime` / `visibilityTime`) +- **This metric is used for scoring and primary comparisons** by default + +**Why This Distinction Matters**: + +- A banner that renders instantly but fades in slowly should score differently than one that renders slower but is immediately visible +- CSS animations can delay user-perceived visibility even after technical rendering +- Measuring visibility aligns with Core Web Vitals' focus on user experience + +### Opacity Threshold + +We use an opacity threshold of **0.5** (50% opacity) to determine visibility: + +- An element with opacity ≤ 0.5 is considered not visible to users +- An element with opacity > 0.5 is considered visible +- This accounts for CSS fade-in animations that gradually reveal the banner +- This threshold balances technical accuracy with user perception + +### Measurement Baseline + +All timing measurements start from `navigationStart`: + +- Includes Time to First Byte (TTFB) +- Includes server response time +- Includes network latency +- Aligns with Core Web Vitals measurement standards +- Represents total time from page load initiation to metric completion + +This means results reflect the complete user experience, including server-side performance and network conditions. + +## Network Conditions + +### Current Implementation + +Currently, benchmarks run on **localhost** with **no network throttling**: + +- Ideal network conditions (~9-35ms TTFB) +- No bandwidth limitations +- No latency simulation +- Results reflect optimal performance + +**Impact on Results**: + +- Results represent best-case performance +- Real-world performance will vary based on network conditions +- Differences between implementations are isolated from network variability +- Fair comparison when all implementations tested under same conditions + +### Future Considerations + +We are evaluating network throttling options: + +- **Cable Profile** (5 Mbps, 28ms latency): Minimal impact, maintains speed +- **Fast 3G** (1.6 Mbps, 562ms latency): More realistic, significantly impacts TTFB +- **Slow 4G**: Balanced approach for modern connections + +Any future changes to network conditions will be clearly documented and versioned. + +## Metrics Tracked + +### Primary Metrics (Used for Scoring) + +**User-visible time** (used for scoring): + +- Time from `navigationStart` until banner opacity > 0.5 +- Primary metric for UX scoring; scoring is based on this value, not DOM presence time +- Accounts for CSS animations +- Measured in milliseconds +- Both DOM presence and user-visible times are collected each run and shown in CLI results + +**Banner Interactive Time**: + +- Time from `navigationStart` until banner buttons become clickable +- Measures when users can actually interact with the banner +- Uses `offsetParent` check to verify clickability + +**Layout Shift Impact**: + +- Cumulative Layout Shift (CLS) caused by banner appearance +- Measures visual stability impact +- Lower is better (0 = no layout shift) + +**Viewport Coverage**: + +- Percentage of viewport covered by banner +- Calculated as: `(visibleArea / viewportArea) * 100` +- Accounts for partial visibility (banners extending beyond viewport) + +**Network Impact**: + +- Total size of banner-related network requests +- Number of network requests +- Download time for banner resources + +### Secondary Metrics (Tracked for Reference) + +**Banner Render Time**: + +- Technical render time (when element appears in DOM) +- Not used for scoring +- Available for technical analysis + +**Banner Hydration Time**: + +- Time from render to interactive: `interactiveTime - renderTime` +- Measures JavaScript execution and event binding time +- Useful for understanding banner implementation performance + +## Scoring Methodology + +### How Scores Are Calculated + +Our scoring system evaluates multiple categories: + +**Performance Score** (40% weight): + +- First Contentful Paint (FCP) +- Largest Contentful Paint (LCP) +- Cumulative Layout Shift (CLS) +- Time to Interactive (TTI) +- Total Blocking Time (TBT) +- Time to First Byte (TTFB) + +**Bundle Strategy Score** (25% weight): + +- Bundle type (Bundled vs IIFE) +- Third-party dependencies +- Bundler type +- TypeScript usage + +**Network Impact Score** (20% weight): + +- Total bundle size +- Third-party size +- Network requests count +- Script load time + +**Transparency Score** (10% weight): + +- Open-source status +- Company information +- Tech stack transparency + +**User Experience Score** (5% weight): + +- Layout stability (CLS) +- Banner render time (uses visibility time) +- Viewport coverage + +### Banner Visibility Time Scoring + +Banner visibility time is scored within the User Experience category: + +- **≤ 25ms**: Excellent (35 points) +- **≤ 50ms**: Very Good (25 points) +- **≤ 100ms**: Good (15 points) +- **≤ 200ms**: Fair (10 points) +- **> 200ms**: Poor (5 points) + +**Note**: Scoring uses `bannerVisibilityTime` (opacity-based), not `bannerRenderTime` (technical). This ensures scores reflect actual user experience. + +## Reproducibility + +### Configuration Requirements + +Each benchmark requires a `config.json` file with: + +- Cookie banner selectors (CSS selectors to detect the banner) +- Service hosts (domains used by the cookie service) +- Tech stack information +- Iteration count + +### Running Benchmarks + +```bash +# Run benchmarks +pnpm benchmark + +# View results +pnpm results +``` + +### What Affects Results + +**Consistent Factors**: + +- Browser engine (Chromium) +- Viewport size (1280x720) +- Detection selectors +- Measurement methodology + +**Variable Factors**: + +- Server performance (if testing SSR) +- System load +- Network conditions (currently localhost) + +**Best Practices**: + +- Run multiple iterations (default: 20) +- Ensure consistent server state +- Clear browser cache between runs +- Use same environment for all comparisons + +## Limitations + +### Current Limitations + +1. **Network Conditions**: + - No throttling means results reflect optimal conditions + - Real-world performance will vary + - Future: Network throttling support + +2. **Measurement Window**: + - Some metrics collected over 1-second window + - CLS may need longer observation periods + - Future: Configurable observation windows + +3. **Banner Detection**: + - Requires accurate CSS selectors + - May miss dynamically loaded banners + - Detection timeout: 10 seconds + +4. **Animation Timing**: + - Opacity threshold may not account for all animation types + - Transform-based animations not measured + - Future: Enhanced animation detection + +### Future Improvements + +- Network throttling support +- More granular animation detection +- Configurable observation windows +- Enhanced banner detection algorithms +- Real-world performance simulation + +## Transparency Statement + +We believe in transparent benchmarking: + +- **Open Methodology**: This document explains exactly how we measure +- **Open Source**: Benchmark code is available for review +- **Reproducible**: Anyone can run the same benchmarks +- **Honest Metrics**: We measure user-perceived visibility, not just technical render time +- **Clear Limitations**: We document what we measure and what we don't + +## Industry Standards Alignment + +Our methodology aligns with: + +- **Core Web Vitals**: User-centric performance metrics +- **Lighthouse**: Measurement approaches and thresholds +- **WebPageTest**: Performance testing practices +- **W3C Performance Timeline**: Standard timing APIs + +We measure what matters to users, not just what's technically possible. + +## Questions or Feedback + +If you have questions about our methodology or suggestions for improvement, please open an issue on our GitHub repository. + +--- + +**Last Updated**: 2026-02-16 +**Version**: 2.0 diff --git a/README.md b/README.md index a4e888f..2cc2864 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,8 @@ A benchmarking tool for measuring the performance impact of cookie consent solut This tool measures various performance metrics when loading web applications with different cookie consent solutions. It helps developers understand the performance implications of their cookie consent implementation choices. +For detailed information about how benchmarks are measured, see [METHODOLOGY.md](./METHODOLOGY.md). + ## Metrics Measured ### Core Web Vitals @@ -17,7 +19,11 @@ This tool measures various performance metrics when loading web applications wit ### Additional Metrics - **Total Time**: Complete page load time - **Script Load Time**: Time taken to load and execute JavaScript -- **Banner Render Time**: Time taken to render the cookie consent banner +- **DOM presence time**: Technical render time (when element appears in DOM); collected every run +- **User-visible time**: When banner is visible to users (opacity > 0.5); **used for scoring**; collected every run +- **Banner Interactive Time**: Time until banner buttons become clickable + +Both DOM presence and user-visible timings are collected in every run and shown in results. Scoring uses **user-visible time** by default. See [METHODOLOGY.md](./METHODOLOGY.md) for details. ### Resource Size Metrics - **Total Size**: Combined size of all resources @@ -41,7 +47,8 @@ This tool measures various performance metrics when loading web applications wit 2. **Performance Metrics**: - Metrics are collected over a 1-second window after page load - Some metrics (like CLS) may need longer observation periods - - Network conditions are not simulated + - Network conditions are not simulated (benchmarks run on localhost) + - See [METHODOLOGY.md](./METHODOLOGY.md) for detailed limitations and measurement approach ## Usage @@ -93,7 +100,7 @@ Each benchmark implementation requires a `config.json` file with the following s - `frameworks`: Array of frameworks used - `bundler`: Build tool used (e.g., webpack, vite) - `packageManager`: Package manager used (e.g., npm, pnpm) - - `bundleType`: Output format (esm, iffe, cjs) + - `bundleType`: Output format (esm, cjs, iife, bundled) - `typescript`: Whether TypeScript is used - **source**: Project source information diff --git a/benchmarks/baseline/config.json b/benchmarks/baseline/config.json index 271d784..c2d88ef 100644 --- a/benchmarks/baseline/config.json +++ b/benchmarks/baseline/config.json @@ -26,5 +26,19 @@ "includes": { "components": ["javascript"] }, - "tags": ["baseline"] + "tags": ["baseline"], + "runProfile": { + "cacheMode": "cold", + "networkProfile": "none", + "cpuSlowdownMultiplier": 1 + }, + "measurement": { + "minSuccessfulIterations": 1, + "maxFailureRate": 0.2, + "stabilityThresholdCv": 15 + }, + "internationalization": { + "detection": "none", + "stringLoading": "none" + } } diff --git a/benchmarks/baseline/next-env.d.ts b/benchmarks/baseline/next-env.d.ts index 1b3be08..9edff1c 100644 --- a/benchmarks/baseline/next-env.d.ts +++ b/benchmarks/baseline/next-env.d.ts @@ -1,5 +1,6 @@ /// /// +import "./.next/types/routes.d.ts"; // NOTE: This file should not be edited // see https://nextjs.org/docs/app/api-reference/config/typescript for more information. diff --git a/benchmarks/baseline/package.json b/benchmarks/baseline/package.json index 973edfd..640cb87 100644 --- a/benchmarks/baseline/package.json +++ b/benchmarks/baseline/package.json @@ -3,25 +3,26 @@ "version": "0.1.0", "private": true, "scripts": { - "benchmark": "pnpm exec benchmark-cli benchmark", - "build": "next build ", + "build": "next build", "dev": "next dev --port 3000", "fmt": "biome format . --write", "lint": "biome lint .", "start": "next start" }, "dependencies": { - "next": "16.0.7", - "react": "^19.2.1", - "react-dom": "^19.2.1" + "next": "catalog:", + "react": "catalog:", + "react-dom": "catalog:" }, "devDependencies": { "@cookiebench/benchmark-schema": "workspace:*", - "@cookiebench/cli": "workspace:*", "@cookiebench/ts-config": "workspace:*", - "@types/node": "^24.10.1", - "@types/react": "^19.2.7", - "@types/react-dom": "^19.2.3", - "typescript": "^5.9.3" + "@types/node": "catalog:", + "@types/react": "catalog:", + "@types/react-dom": "catalog:", + "typescript": "catalog:" + }, + "engines": { + "node": ">=20.9.0" } } diff --git a/benchmarks/with-c15t-nextjs/app/favicon.ico b/benchmarks/c15t-nextjs/app/favicon.ico similarity index 100% rename from benchmarks/with-c15t-nextjs/app/favicon.ico rename to benchmarks/c15t-nextjs/app/favicon.ico diff --git a/benchmarks/with-c15t-nextjs/app/layout.tsx b/benchmarks/c15t-nextjs/app/layout.tsx similarity index 100% rename from benchmarks/with-c15t-nextjs/app/layout.tsx rename to benchmarks/c15t-nextjs/app/layout.tsx diff --git a/benchmarks/with-c15t-nextjs/app/page.tsx b/benchmarks/c15t-nextjs/app/page.tsx similarity index 100% rename from benchmarks/with-c15t-nextjs/app/page.tsx rename to benchmarks/c15t-nextjs/app/page.tsx diff --git a/benchmarks/with-c15t-nextjs/config.json b/benchmarks/c15t-nextjs/config.json similarity index 82% rename from benchmarks/with-c15t-nextjs/config.json rename to benchmarks/c15t-nextjs/config.json index 9aabb6b..cfc941e 100644 --- a/benchmarks/with-c15t-nextjs/config.json +++ b/benchmarks/c15t-nextjs/config.json @@ -1,6 +1,6 @@ { "$schema": "./node_modules/@cookiebench/benchmark-schema/schema.json", - "name": "with-c15t-nextjs", + "name": "c15t-nextjs", "iterations": 20, "cookieBanner": { "selectors": [ @@ -44,5 +44,15 @@ "website": "https://c15t.com", "avatar": "https://zxlypdluowixfd7j.public.blob.vercel-storage.com/c15t-icon-z6gQxO0ogxWgY51dluWPhNfAoPyELT.png" }, - "tags": ["c15t"] + "tags": ["c15t"], + "runProfile": { + "cacheMode": "cold", + "networkProfile": "none", + "cpuSlowdownMultiplier": 1 + }, + "measurement": { + "minSuccessfulIterations": 16, + "maxFailureRate": 0.2, + "stabilityThresholdCv": 15 + } } diff --git a/benchmarks/with-c15t-nextjs/next-env.d.ts b/benchmarks/c15t-nextjs/next-env.d.ts similarity index 100% rename from benchmarks/with-c15t-nextjs/next-env.d.ts rename to benchmarks/c15t-nextjs/next-env.d.ts diff --git a/benchmarks/c15t-nextjs/next.config.ts b/benchmarks/c15t-nextjs/next.config.ts new file mode 100644 index 0000000..dd8b328 --- /dev/null +++ b/benchmarks/c15t-nextjs/next.config.ts @@ -0,0 +1,15 @@ +import type { NextConfig } from "next"; + +const nextConfig: NextConfig = { + images: { + localPatterns: [ + { + pathname: "/**", + search: "", + }, + ], + minimumCacheTTL: 60, + }, +}; + +export default nextConfig; diff --git a/benchmarks/with-cookie-control/package.json b/benchmarks/c15t-nextjs/package.json similarity index 51% rename from benchmarks/with-cookie-control/package.json rename to benchmarks/c15t-nextjs/package.json index d85d95f..9a60163 100644 --- a/benchmarks/with-cookie-control/package.json +++ b/benchmarks/c15t-nextjs/package.json @@ -1,8 +1,8 @@ { - "name": "with-cookie-control", + "name": "c15t-nextjs", + "version": "0.1.0", "private": true, "scripts": { - "benchmark": "pnpm exec benchmark-cli benchmark", "build": "next build", "dev": "next dev --port 3001", "fmt": "biome format . --write", @@ -10,17 +10,20 @@ "start": "next start" }, "dependencies": { - "next": "16.0.7", - "react": "^19.2.1", - "react-dom": "^19.2.1" + "@c15t/nextjs": "1.8.3", + "next": "catalog:", + "react": "catalog:", + "react-dom": "catalog:" }, "devDependencies": { "@cookiebench/benchmark-schema": "workspace:*", - "@cookiebench/cli": "workspace:*", "@cookiebench/ts-config": "workspace:*", - "@types/node": "^24.10.1", - "@types/react": "^19.2.7", - "@types/react-dom": "^19.2.3", - "typescript": "^5.9.3" + "@types/node": "catalog:", + "@types/react": "catalog:", + "@types/react-dom": "catalog:", + "typescript": "catalog:" + }, + "engines": { + "node": ">=20.9.0" } } diff --git a/benchmarks/with-c15t-nextjs/tsconfig.json b/benchmarks/c15t-nextjs/tsconfig.json similarity index 100% rename from benchmarks/with-c15t-nextjs/tsconfig.json rename to benchmarks/c15t-nextjs/tsconfig.json diff --git a/benchmarks/with-c15t-react/app/favicon.ico b/benchmarks/c15t-react/app/favicon.ico similarity index 100% rename from benchmarks/with-c15t-react/app/favicon.ico rename to benchmarks/c15t-react/app/favicon.ico diff --git a/benchmarks/with-c15t-react/app/layout.tsx b/benchmarks/c15t-react/app/layout.tsx similarity index 100% rename from benchmarks/with-c15t-react/app/layout.tsx rename to benchmarks/c15t-react/app/layout.tsx diff --git a/benchmarks/with-c15t-react/app/page.tsx b/benchmarks/c15t-react/app/page.tsx similarity index 100% rename from benchmarks/with-c15t-react/app/page.tsx rename to benchmarks/c15t-react/app/page.tsx diff --git a/benchmarks/with-c15t-react/config.json b/benchmarks/c15t-react/config.json similarity index 74% rename from benchmarks/with-c15t-react/config.json rename to benchmarks/c15t-react/config.json index b174fc7..27ced14 100644 --- a/benchmarks/with-c15t-react/config.json +++ b/benchmarks/c15t-react/config.json @@ -1,6 +1,6 @@ { "$schema": "./node_modules/@cookiebench/benchmark-schema/schema.json", - "name": "with-c15t-react", + "name": "c15t-react", "iterations": 20, "cookieBanner": { "selectors": [ @@ -10,7 +10,11 @@ ".consent-banner", "[data-consent-banner]" ], - "serviceHosts": ["c15t.com", "consent.io"], + "serviceHosts": [ + "c15t.com", + "consent.io", + "consent-io-europe-benchmarks.c15t.dev" + ], "waitForVisibility": true, "measureViewportCoverage": true, "expectedLayoutShift": false, @@ -28,7 +32,7 @@ "github": "github.com/c15t/c15t", "isOpenSource": true, "license": "GPL-3.0-only", - "npm": "@c15t/nextjs", + "npm": "@c15t/react@1.7.1", "website": "https://www.c15t.com" }, "includes": { @@ -44,5 +48,15 @@ "website": "https://c15t.com", "avatar": "https://zxlypdluowixfd7j.public.blob.vercel-storage.com/c15t-icon-z6gQxO0ogxWgY51dluWPhNfAoPyELT.png" }, - "tags": ["c15t"] + "tags": ["c15t"], + "runProfile": { + "cacheMode": "cold", + "networkProfile": "none", + "cpuSlowdownMultiplier": 1 + }, + "measurement": { + "minSuccessfulIterations": 16, + "maxFailureRate": 0.2, + "stabilityThresholdCv": 15 + } } diff --git a/benchmarks/with-cookie-control/next-env.d.ts b/benchmarks/c15t-react/next-env.d.ts similarity index 85% rename from benchmarks/with-cookie-control/next-env.d.ts rename to benchmarks/c15t-react/next-env.d.ts index 1b3be08..9edff1c 100644 --- a/benchmarks/with-cookie-control/next-env.d.ts +++ b/benchmarks/c15t-react/next-env.d.ts @@ -1,5 +1,6 @@ /// /// +import "./.next/types/routes.d.ts"; // NOTE: This file should not be edited // see https://nextjs.org/docs/app/api-reference/config/typescript for more information. diff --git a/benchmarks/with-c15t-nextjs/next.config.ts b/benchmarks/c15t-react/next.config.ts similarity index 100% rename from benchmarks/with-c15t-nextjs/next.config.ts rename to benchmarks/c15t-react/next.config.ts diff --git a/benchmarks/c15t-react/package.json b/benchmarks/c15t-react/package.json new file mode 100644 index 0000000..9052679 --- /dev/null +++ b/benchmarks/c15t-react/package.json @@ -0,0 +1,28 @@ +{ + "name": "c15t-react", + "private": true, + "scripts": { + "build": "next build", + "dev": "next dev --port 3003", + "fmt": "biome format . --write", + "lint": "biome lint .", + "start": "next start --port 3003" + }, + "dependencies": { + "@c15t/react": "1.7.1", + "next": "catalog:", + "react": "catalog:", + "react-dom": "catalog:" + }, + "devDependencies": { + "@cookiebench/benchmark-schema": "workspace:*", + "@cookiebench/ts-config": "workspace:*", + "@types/node": "catalog:", + "@types/react": "catalog:", + "@types/react-dom": "catalog:", + "typescript": "catalog:" + }, + "engines": { + "node": ">=20.9.0" + } +} diff --git a/benchmarks/with-c15t-react/tsconfig.json b/benchmarks/c15t-react/tsconfig.json similarity index 100% rename from benchmarks/with-c15t-react/tsconfig.json rename to benchmarks/c15t-react/tsconfig.json diff --git a/benchmarks/with-cookie-control/app/favicon.ico b/benchmarks/cookie-control/app/favicon.ico similarity index 100% rename from benchmarks/with-cookie-control/app/favicon.ico rename to benchmarks/cookie-control/app/favicon.ico diff --git a/benchmarks/with-cookie-control/app/layout.tsx b/benchmarks/cookie-control/app/layout.tsx similarity index 83% rename from benchmarks/with-cookie-control/app/layout.tsx rename to benchmarks/cookie-control/app/layout.tsx index 505cff4..beb311a 100644 --- a/benchmarks/with-cookie-control/app/layout.tsx +++ b/benchmarks/cookie-control/app/layout.tsx @@ -1,8 +1,8 @@ -import type { Metadata } from 'next'; -import type { ReactNode } from 'react'; +import type { Metadata } from "next"; +import type { ReactNode } from "react"; export const metadata: Metadata = { - title: 'benchmark', + title: "benchmark", }; export default function RootLayout({ @@ -19,7 +19,7 @@ export default function RootLayout({ type="text/javascript" />