{"slug": "web-performance-beyond-core-web-vitals", "title": "Web performance beyond Core Web Vitals", "summary": "This article provides a comprehensive framework for web performance optimization that extends beyond Google's Core Web Vitals, covering server configuration, CDN strategy, caching layers, and resource optimization across the full stack. It emphasizes that performance directly impacts search rankings, conversion rates, and AI engine crawl frequency, while distinguishing between lab-based testing (like Lighthouse) and real-user field data (like CrUX) for accurate measurement. The guide also includes specific technical recommendations for hosting infrastructure, such as using modern PHP versions, SSD storage, and optimized Nginx configurations, illustrated through a case study of managing 130+ sites on self-managed Linux servers.", "body_md": "Originally published atPart of ThatDevPro's open SEO + AI framework library.[thatdevpro.com].[ThatDevPro]is an SDVOSB-certified veteran-owned web + AI engineering studio. Open-source AI citation toolkit:[github.com/Janady13/aio-surfaces].\n\n**Core Web Vitals Deep Dive, Resource Optimization, Server Performance, CDN Strategy, Caching Layers, and the Comprehensive Discipline of Web Performance**\n\nA comprehensive reference for web performance optimization across the full stack. Performance affects rankings (Core Web Vitals are explicit ranking factors), conversion (slow sites lose visitors), and AI engine accessibility (slow sites get crawled less). Performance is both technical foundation and competitive differentiation.\n\n## 1. Document Purpose\n\nPerformance work spans many disciplines: server configuration, CDN selection, asset optimization, database tuning, frontend code, third-party scripts, image handling, font delivery, and more. Each layer offers optimization opportunities; cumulative impact determines real-world performance.\n\nThis framework specifies the comprehensive performance optimization approach, complementing `framework-pageexperience.md`\n\n(Core Web Vitals focus) with broader performance considerations.\n\nFor Joseph's portfolio managing 130+ sites on self-managed Linux infrastructure, performance discipline at scale matters significantly.\n\n### 1.1 Required Tools\n\n-\n**PageSpeed Insights**—`pagespeed.web.dev`\n\n— Core Web Vitals + Lighthouse -\n**Lighthouse**— Chrome DevTools comprehensive audit -\n**WebPageTest**—`webpagetest.org`\n\n— detailed waterfall analysis -\n**GTmetrix**— performance dashboards -\n**Real User Monitoring**— actual user performance data -\n**Chrome DevTools**— Performance and Network tabs -\n**Server monitoring**— Linux tools (top, iostat, etc.)\n\n## 2. Performance Measurement\n\n### 2.1 Lab vs Field Data\n\n```\nperformance_measurement_types:\n\n  lab_data:\n    description: \"Synthetic testing in controlled environment\"\n    tools: [\"Lighthouse\", \"WebPageTest\", \"GTmetrix\"]\n    benefits:\n      - Reproducible\n      - Controlled variables\n      - Detailed waterfall analysis\n    limitations:\n      - Doesn't reflect real user variety\n      - May test under ideal conditions\n      - Can be gamed for higher scores\n\n  field_data:\n    description: \"Real user monitoring (RUM) of actual visits\"\n    sources: [\"Chrome User Experience Report (CrUX)\", \"Self-deployed RUM\"]\n    benefits:\n      - Reflects real-world performance\n      - Across user device/network variety\n      - What Google uses for ranking\n    limitations:\n      - Less granular debugging\n      - Slower feedback loop\n      - Privacy considerations\n\n  use_both:\n    rationale: \"Lab for debugging; field for reality\"\n    monitoring_pattern: \"Lab during development; field in production\"\n```\n\n### 2.2 Core Web Vitals (2026)\n\n```\ncore_web_vitals_2026:\n\n  lcp_largest_contentful_paint:\n    measures: \"Loading performance\"\n    target: \"Under 2.5 seconds\"\n    measurement_window: \"75th percentile of users\"\n\n  inp_interaction_to_next_paint:\n    measures: \"Responsiveness\"\n    target: \"Under 200ms\"\n    measurement_window: \"75th percentile\"\n    note: \"Replaced FID in March 2024\"\n\n  cls_cumulative_layout_shift:\n    measures: \"Visual stability\"\n    target: \"Under 0.1\"\n    measurement_window: \"75th percentile\"\n```\n\n### 2.3 Additional Performance Metrics\n\n```\nadditional_metrics:\n\n  ttfb_time_to_first_byte:\n    measures: \"Server response time\"\n    target: \"Under 800ms\"\n    significance: \"Foundation for all subsequent metrics\"\n\n  fcp_first_contentful_paint:\n    measures: \"First content visible\"\n    target: \"Under 1.8 seconds\"\n\n  speed_index:\n    measures: \"How quickly content visible during load\"\n    target: \"Under 3.4 seconds (mobile)\"\n\n  total_blocking_time:\n    measures: \"Main thread blocking\"\n    target: \"Under 200ms\"\n\n  time_to_interactive:\n    measures: \"When page fully interactive\"\n    target: \"Under 3.8 seconds (mobile)\"\n```\n\n## 3. Server Performance\n\n### 3.1 Hosting Foundation\n\nPerformance starts with hosting. Cheap shared hosting makes optimization difficult.\n\n```\nhosting_performance_factors:\n\n  resources:\n    cpu: \"Adequate cores; not throttled\"\n    ram: \"Sufficient for application needs\"\n    disk_io: \"SSD essential; NVMe preferred\"\n    network: \"Gigabit connectivity\"\n\n  configuration:\n    php_version: \"Modern PHP 8.x\"\n    web_server: \"Nginx or Apache 2.4+ optimized\"\n    database: \"MySQL 8 or MariaDB 10.6+\"\n\n  scaling:\n    vertical: \"More resources on same server\"\n    horizontal: \"Multiple servers; load balancing\"\n    auto_scaling: \"Cloud providers; scales with traffic\"\n\n  joseph_setup:\n    server: \"Bubbles (self-managed Debian)\"\n    sites: \"130+ production sites\"\n    optimization: \"Resource allocation per site; appropriate caching\"\n```\n\n### 3.2 Nginx Optimization\n\n```\n# Optimized Nginx configuration patterns\n\n# Worker processes\nworker_processes auto;\nworker_rlimit_nofile 65535;\n\nevents {\n    worker_connections 1024;\n    multi_accept on;\n    use epoll;\n}\n\nhttp {\n    # Sendfile for static files\n    sendfile on;\n    tcp_nopush on;\n    tcp_nodelay on;\n\n    # Keep alive\n    keepalive_timeout 30;\n    keepalive_requests 100;\n\n    # Buffers\n    client_body_buffer_size 16k;\n    client_max_body_size 100m;\n    client_header_buffer_size 1k;\n    large_client_header_buffers 4 8k;\n\n    # Compression\n    gzip on;\n    gzip_vary on;\n    gzip_proxied any;\n    gzip_comp_level 6;\n    gzip_types\n        text/plain\n        text/css\n        text/xml\n        text/javascript\n        application/json\n        application/javascript\n        application/xml+rss\n        application/xml\n        image/svg+xml\n        font/woff\n        font/woff2;\n\n    # Brotli (if module installed)\n    brotli on;\n    brotli_comp_level 6;\n    brotli_types\n        text/plain\n        text/css\n        text/xml\n        text/javascript\n        application/json\n        application/javascript\n        application/xml+rss\n        application/xml\n        image/svg+xml;\n\n    # FastCGI cache for PHP\n    fastcgi_cache_path /var/cache/nginx levels=1:2 keys_zone=fcgi:100m max_size=1g inactive=60m;\n    fastcgi_cache_use_stale error timeout invalid_header http_500;\n    fastcgi_cache_lock on;\n\n    # HTTP/2 push (HTTP/2)\n    http2_push_preload on;\n}\n```\n\n### 3.3 PHP-FPM Optimization\n\n```\n# /etc/php/8.2/fpm/pool.d/www.conf\n\n; Process management\npm = dynamic\npm.max_children = 50\npm.start_servers = 5\npm.min_spare_servers = 5\npm.max_spare_servers = 35\npm.max_requests = 500\n\n; Slow log\nslowlog = /var/log/php-fpm-slow.log\nrequest_slowlog_timeout = 5s\n\n; OPcache\nopcache.enable = 1\nopcache.memory_consumption = 256\nopcache.interned_strings_buffer = 16\nopcache.max_accelerated_files = 20000\nopcache.validate_timestamps = 0  ; Production; restart on deploy\nopcache.save_comments = 1\n```\n\n### 3.4 Database Optimization\n\n```\nmysql_optimization:\n\n  configuration:\n    innodb_buffer_pool_size: \"70-80% of RAM for dedicated DB server\"\n    innodb_log_file_size: \"256MB+\"\n    innodb_flush_method: \"O_DIRECT\"\n    query_cache_size: \"Removed in MySQL 8; use other caching\"\n\n  indexing:\n    - Index foreign keys\n    - Index columns used in WHERE clauses frequently\n    - Composite indexes for multi-column queries\n    - Avoid over-indexing (indexes slow writes)\n\n  query_optimization:\n    - EXPLAIN to analyze queries\n    - Avoid SELECT *\n    - Limit result sets where possible\n    - Optimize joins\n\n  ongoing_maintenance:\n    - Regular OPTIMIZE TABLE\n    - Slow query log monitoring\n    - Long-running query alerts\n```\n\n## 4. Caching Strategy\n\n### 4.1 Caching Layers\n\n```\ncaching_layers:\n\n  browser_cache:\n    location: \"User's browser\"\n    purpose: \"Repeat visitors don't re-download\"\n    configuration: \"Cache-Control headers\"\n\n  cdn_cache:\n    location: \"CDN edge servers globally\"\n    purpose: \"Geographic proximity\"\n    services: [\"Cloudflare\", \"Fastly\", \"BunnyCDN\", \"KeyCDN\"]\n\n  reverse_proxy_cache:\n    location: \"Front of application server\"\n    examples: [\"Varnish\", \"Nginx FastCGI cache\"]\n    purpose: \"Avoid hitting application for cached responses\"\n\n  application_cache:\n    location: \"Application memory\"\n    examples: [\"WordPress object cache\", \"Rails cache\"]\n    purpose: \"Cache expensive computations\"\n\n  database_query_cache:\n    location: \"Object cache backed by Redis/Memcached\"\n    purpose: \"Cache database query results\"\n\n  cdn_origin_shield:\n    location: \"Between CDN and origin\"\n    purpose: \"Reduce origin load\"\n    services: [\"Cloudflare Argo\", \"Fastly Origin Shield\"]\n```\n\n### 4.2 Cache Headers\n\n```\n# Static assets — cache aggressively\nlocation ~* \\.(jpg|jpeg|png|gif|ico|svg|webp|woff|woff2|ttf|css|js)$ {\n    expires 1y;\n    add_header Cache-Control \"public, immutable\";\n    access_log off;\n}\n\n# HTML — cache briefly, allow revalidation\nlocation ~* \\.html$ {\n    expires 1h;\n    add_header Cache-Control \"public, must-revalidate\";\n}\n\n# API responses — typically don't cache\nlocation /api/ {\n    add_header Cache-Control \"no-store, no-cache, must-revalidate\";\n}\n```\n\n### 4.3 Object Cache (Redis)\n\nFor WordPress and other database-heavy applications:\n\n```\nredis_object_cache:\n\n  setup:\n    install: \"apt install redis-server\"\n    php_extension: \"apt install php8.2-redis\"\n    plugin: \"Redis Object Cache plugin (WordPress)\"\n\n  benefits:\n    - Significant database load reduction\n    - Faster page generation\n    - Better scalability\n\n  configuration:\n    maxmemory: \"Set based on available RAM\"\n    maxmemory_policy: \"allkeys-lru\"\n    persistence: \"Disable for cache use (improves performance)\"\n```\n\n### 4.4 Page Cache\n\n```\npage_cache_strategies:\n\n  full_page_cache:\n    pattern: \"Cache complete HTML responses\"\n    benefit: \"Skip PHP/DB entirely for cached pages\"\n    invalidation: \"Clear on content updates\"\n\n  partial_caching:\n    pattern: \"Cache specific page sections\"\n    use_for: \"Mostly static with some dynamic parts\"\n\n  dynamic_caching:\n    pattern: \"Cache for short periods (1-60 seconds)\"\n    use_for: \"High-traffic dynamic sites\"\n    benefit: \"Significant load reduction even on dynamic content\"\n\n  edge_side_includes:\n    pattern: \"Cache shell; insert dynamic blocks\"\n    technology: \"Varnish ESI; Cloudflare Workers\"\n```\n\n## 5. CDN Strategy\n\n### 5.1 CDN Selection\n\n```\ncdn_options:\n\n  cloudflare:\n    pricing: \"Free tier generous; Pro $20/month; higher tiers\"\n    features:\n      - Global edge network\n      - DDoS protection\n      - WAF\n      - Argo intelligent routing (paid)\n      - Workers (edge compute)\n      - Image optimization (paid)\n      - R2 object storage\n    best_for: \"Most sites; comprehensive features\"\n    used_widely: \"Industry standard for many\"\n\n  fastly:\n    pricing: \"Pay per usage; minimum spend\"\n    features:\n      - Edge compute (VCL, Compute@Edge)\n      - Real-time logging\n      - Highly programmable\n    best_for: \"High-traffic sites with custom needs\"\n\n  bunnycdn:\n    pricing: \"Very competitive ($1/month minimum)\"\n    features:\n      - Bunny Optimizer (image optimization)\n      - Edge storage\n      - Stream (video)\n    best_for: \"Cost-conscious sites\"\n\n  keycdn:\n    pricing: \"Competitive; pay-per-usage\"\n    features:\n      - Strong edge network\n      - Image processing\n    best_for: \"Cost-conscious alternative\"\n\n  vercel_netlify_built_in:\n    note: \"Included with these hosting platforms\"\n    benefit: \"Integrated workflow\"\n```\n\n### 5.2 CDN Configuration\n\n```\ncdn_optimization:\n\n  cache_rules:\n    static_assets: \"Cache aggressively (1 year)\"\n    html: \"Cache briefly (5 minutes - 1 hour)\"\n    api: \"Typically no cache\"\n    custom: \"Per-path rules\"\n\n  ssl:\n    requirement: \"HTTPS via CDN\"\n    options:\n      flexible: \"CDN to origin via HTTP (less secure)\"\n      full: \"End-to-end HTTPS\"\n      strict: \"End-to-end HTTPS with origin certificate validation (best)\"\n\n  page_rules_cloudflare:\n    examples:\n      - \"Cache everything for /static/* (1 year)\"\n      - \"Bypass cache for /admin/*\"\n      - \"Always use HTTPS\"\n\n  performance_features:\n    auto_minify: \"Minify HTML, CSS, JS\"\n    rocket_loader: \"Async JavaScript loading\"\n    early_hints: \"HTTP 103 for resource preload\"\n    http2_prioritization: \"Smart resource prioritization\"\n    http3: \"Latest HTTP version\"\n```\n\n## 6. Asset Optimization\n\n### 6.1 Image Optimization\n\nSee `framework-imageseo.md`\n\nSection 4. Key performance points:\n\n```\nimage_performance:\n\n  formats:\n    modern: \"AVIF (best compression); WebP (broadly supported)\"\n    fallback: \"JPEG for photos; PNG for graphics\"\n    technique: \"<picture> with multiple sources\"\n\n  responsive_images:\n    pattern: \"srcset with appropriate sizes\"\n    benefit: \"Load size matching viewport\"\n\n  compression:\n    photos: \"JPEG quality 75-85 typically\"\n    graphics: \"PNG-8 where colors limited\"\n    automation: \"ImageMagick, sharp, build-time tools\"\n\n  lazy_loading:\n    standard: 'loading=\"lazy\" attribute'\n    benefit: \"Below-fold images load on demand\"\n    first_paint_image: 'loading=\"eager\" or no attribute'\n\n  cdn_image_optimization:\n    services: \"Cloudflare Polish, Bunny Optimizer, Cloudinary, Imgix\"\n    benefit: \"On-the-fly optimization at CDN\"\n```\n\n### 6.2 JavaScript Optimization\n\n```\njavascript_optimization:\n\n  minimize_total:\n    rule: \"Less JavaScript is better\"\n    audit: \"Coverage tab in Chrome DevTools\"\n    remove: \"Unused libraries and code\"\n\n  code_splitting:\n    pattern: \"Per-route or per-feature bundles\"\n    framework_support: \"Webpack, Rollup, esbuild built-in\"\n\n  defer_and_async:\n    defer: \"Wait until DOM ready\"\n    async: \"Load asynchronously; execute when ready\"\n    use_for: \"Non-critical scripts\"\n\n  third_party_audit:\n    audit: \"Each third-party script: necessary?\"\n    common_culprits:\n      - Heavy chat widgets\n      - Multiple analytics tools\n      - Tag manager bloat\n      - Social embeds\n    fixes:\n      - Remove unnecessary\n      - Defer non-critical\n      - Use lighter alternatives\n\n  modern_js:\n    benefit: \"Smaller bundles for modern browsers\"\n    pattern: \"ES modules with module/nomodule\"\n```\n\n### 6.3 CSS Optimization\n\n```\ncss_optimization:\n\n  critical_css:\n    pattern: \"Inline above-fold CSS in head\"\n    benefit: \"Render without waiting for external CSS\"\n    tools: \"Critical, Penthouse, build tools\"\n\n  non_critical_async:\n    pattern: \"Load main CSS asynchronously after render\"\n    technique: 'rel=\"preload\" + onload swap'\n\n  remove_unused:\n    audit: \"Coverage tab shows unused CSS\"\n    tools: \"PurgeCSS, UnCSS, build-time\"\n\n  minimize_imports:\n    rule: \"Don't import full frameworks for partial use\"\n    example: \"Tailwind purges unused classes by default\"\n\n  modern_css:\n    grid_and_flex: \"Replace JavaScript layouts\"\n    css_variables: \"Reduce duplicated values\"\n    container_queries: \"Component-level responsive\"\n```\n\n### 6.4 Font Optimization\n\n```\nfont_optimization:\n\n  font_display_swap:\n    css: \"font-display: swap;\"\n    benefit: \"Show fallback font during font load; swap when ready\"\n    avoid_invisible_text: \"Critical for performance metrics\"\n\n  preload_critical:\n    pattern: '<link rel=\"preload\" as=\"font\" type=\"font/woff2\" crossorigin>'\n    use_for: \"Above-fold fonts\"\n\n  subset_fonts:\n    benefit: \"Smaller file sizes\"\n    use_for: \"Latin-only sites can drop other character sets\"\n\n  variable_fonts:\n    benefit: \"Multiple weights/styles in single file\"\n    consideration: \"May be larger than single weight\"\n\n  self_host_vs_google_fonts:\n    self_host: \"Better performance; eliminates third-party\"\n    google_fonts: \"Simple; broad support\"\n    recommendation: \"Self-host for production\"\n\n  limit_weights:\n    rule: \"Use only weights actually needed\"\n    typical: \"Regular + bold sufficient for most sites\"\n```\n\n## 7. Core Web Vitals Optimization\n\nSee `framework-pageexperience.md`\n\nfor comprehensive treatment. Key points:\n\n### 7.1 LCP Optimization\n\n```\nlcp_optimization:\n\n  identify_lcp_element:\n    tool: \"Chrome DevTools Performance > LCP marker\"\n    typical: \"Hero image or large heading text\"\n\n  optimization_strategies:\n    image_lcp:\n      - Preload the LCP image\n      - Optimize image (size, format)\n      - Use eager loading\n      - CDN delivery\n      - Render server-side\n\n    text_lcp:\n      - Optimize font loading\n      - Preload critical CSS\n      - Minimize render-blocking\n\n    server_response:\n      - Reduce TTFB\n      - Optimize server processing\n      - Effective caching\n```\n\n### 7.2 INP Optimization\n\n```\ninp_optimization:\n\n  reduce_main_thread_work:\n    - Code split JavaScript\n    - Defer non-critical scripts\n    - Web workers for heavy computation\n\n  optimize_event_handlers:\n    - Debounce/throttle expensive handlers\n    - Use requestIdleCallback for non-urgent work\n    - Avoid large synchronous tasks\n\n  third_party_audit:\n    - Heavy third-party scripts often cause INP issues\n    - Defer or remove problematic scripts\n```\n\n### 7.3 CLS Optimization\n\n```\ncls_optimization:\n\n  size_attributes:\n    images: \"Always include width and height attributes\"\n    embeds: \"Reserve space with aspect ratio\"\n\n  font_loading:\n    issue: \"Font swap can cause layout shift\"\n    fix: \"Match fallback font metrics; use size-adjust\"\n\n  ads_and_embeds:\n    issue: \"Late-loading content shifts page\"\n    fix: \"Reserve space proactively\"\n\n  dynamic_content:\n    rule: \"Don't insert above existing content unless triggered by user\"\n```\n\n## 8. Real User Monitoring\n\n### 8.1 RUM Implementation\n\n```\nrum_options:\n\n  free_tools:\n    - Chrome User Experience Report (CrUX)\n    - Google Search Console Core Web Vitals\n    - Cloudflare Web Analytics (free)\n\n  paid_tools:\n    - SpeedCurve\n    - Calibre\n    - Datadog RUM\n    - New Relic Browser\n    - Sentry Performance Monitoring\n\n  custom_implementation:\n    library: \"web-vitals.js\"\n    pattern: \"Send metrics to your analytics\"\n    benefit: \"Custom dashboards\"\n```\n\n### 8.2 Custom Web Vitals Tracking\n\n``` js\nimport { onCLS, onINP, onLCP, onFCP, onTTFB } from 'web-vitals';\n\nfunction sendToAnalytics({name, value, id}) {\n  gtag('event', name, {\n    value: Math.round(name === 'CLS' ? value * 1000 : value),\n    metric_id: id,\n    metric_value: value,\n    metric_delta: value,\n    non_interaction: true,\n  });\n}\n\nonCLS(sendToAnalytics);\nonINP(sendToAnalytics);\nonLCP(sendToAnalytics);\nonFCP(sendToAnalytics);\nonTTFB(sendToAnalytics);\n```\n\nThis sends real user data to GA4 for monitoring.\n\n## 9. Performance Budget\n\n### 9.1 Establishing Budget\n\n```\nperformance_budget:\n\n  page_weight_targets:\n    total: \"Under 1MB ideal; 1-2MB acceptable; 2MB+ concerning\"\n    html: \"Under 100KB\"\n    css: \"Under 100KB\"\n    javascript: \"Under 300KB\"\n    images: \"Variable; lazy-load below fold\"\n    fonts: \"Under 100KB total\"\n\n  request_count_targets:\n    total: \"Under 50 ideal; 50-100 acceptable\"\n    third_party: \"Under 10 ideal\"\n\n  metric_targets:\n    lcp: \"Under 2.0s ideal; under 2.5s acceptable\"\n    inp: \"Under 100ms ideal; under 200ms acceptable\"\n    cls: \"Under 0.05 ideal; under 0.1 acceptable\"\n    ttfb: \"Under 600ms ideal; under 800ms acceptable\"\n```\n\n### 9.2 Enforcing Budget\n\n```\nbudget_enforcement:\n\n  ci_cd_integration:\n    tools: \"Lighthouse CI, SpeedCurve, Calibre\"\n    pattern: \"Performance test on every deployment\"\n    fail_build: \"If thresholds exceeded\"\n\n  monitoring_alerts:\n    pattern: \"Alert when metrics regress\"\n    sensitivity: \"Threshold beyond normal variance\"\n\n  documentation:\n    rule: \"Document the budget; share with team\"\n    review: \"Quarterly budget review and adjustment\"\n```\n\n## 10. Audit Mode\n\n| # | Criterion | Pass/Fail |\n|---|---|---|\n| PF1 | Core Web Vitals targets met (75th percentile) | |\n| PF2 | TTFB under 800ms | |\n| PF3 | Hosting appropriate for traffic | |\n| PF4 | CDN configured and active | |\n| PF5 | Object cache (Redis) running | |\n| PF6 | Page cache configured | |\n| PF7 | Browser cache headers correct | |\n| PF8 | Images optimized (modern formats, compression, lazy) | |\n| PF9 | JavaScript minimized and deferred | |\n| PF10 | CSS optimized (critical inline; rest async) | |\n| PF11 | Fonts optimized (display swap; preload critical) | |\n| PF12 | Third-party scripts audited and minimized | |\n| PF13 | Database optimized | |\n| PF14 | RUM data collected and monitored | |\n| PF15 | Performance budget defined | |\n| PF16 | Regression testing in CI/CD |\n\nScore: 16. World-class performance: 14+/16.\n\n## 11. Common Mistakes\n\n-\n**Cheap shared hosting**— bottleneck regardless of optimization -\n**No CDN**— slow for distant users -\n**No caching layers**— every request hits database -\n**Image bloat**— unoptimized images dominate page weight -\n**Third-party script overload**— heavy widgets, multiple analytics -\n**No font optimization**— invisible text or layout shifts -\n**Render-blocking resources**— synchronous CSS/JS in head -\n**No lazy loading**— loading everything upfront -\n**No RUM**— flying blind on real user experience -\n**No performance regression testing**— performance drifts over time\n\n## End of Framework Document\n\nCompanion documents:\n\n-\n`framework-pageexperience.md`\n\n— Core Web Vitals deep dive -\n`framework-imageseo.md`\n\n— Image-specific optimization -\n`framework-cdn.md`\n\n— CDN strategy detail -\n`framework-hosting.md`\n\n— Hosting selection -\n`framework-serverconfig.md`\n\n— Server configuration\n\n## About this framework library\n\nDev.to republish of a framework from ThatDevPro's SEO + AI engineering library. **Canonical source: https://www.thatdevpro.com/insights/framework-performance/**\n\nThatDevPro is an SDVOSB-certified veteran-owned web + AI engineering studio. Need this framework implemented? [See the Engine Optimization service](https://www.thatdevpro.com/services/engine-optimization/) or hire via [contact](https://www.thatdevpro.com/contact/).", "url": "https://wpnews.pro/news/web-performance-beyond-core-web-vitals", "canonical_source": "https://dev.to/joseph_anady_214bacedf939/web-performance-beyond-core-web-vitals-3jd9", "published_at": "2026-05-24 01:21:37+00:00", "updated_at": "2026-05-24 02:03:37.270548+00:00", "lang": "en", "topics": ["developer-tools", "cloud-computing", "enterprise-software", "data"], "entities": ["ThatDevPro", "Core Web Vitals", "Lighthouse", "WebPageTest", "Linux", "Joseph", "GitHub", "AI"], "alternates": {"html": "https://wpnews.pro/news/web-performance-beyond-core-web-vitals", "markdown": "https://wpnews.pro/news/web-performance-beyond-core-web-vitals.md", "text": "https://wpnews.pro/news/web-performance-beyond-core-web-vitals.txt", "jsonld": "https://wpnews.pro/news/web-performance-beyond-core-web-vitals.jsonld"}}