René's URL Explorer Experiment


Title: Reduce JavaScript payloads with code splitting  |  Articles  |  web.dev

Open Graph Title: Reduce JavaScript payloads with code splitting  |  Articles  |  web.dev

Description: Sending large JavaScript payloads impacts the speed of your site significantly. Instead of shipping all the JavaScript to your user as soon as the first page of your application is loaded, split your bundle into multiple pieces and only send what's necessary at the very beginning.

Open Graph Description: Sending large JavaScript payloads impacts the speed of your site significantly. Instead of shipping all the JavaScript to your user as soon as the first page of your application is loaded, split your bundle into multiple pieces and only send what's necessary at the very beginning.

Opengraph URL: https://web.dev/articles/reduce-javascript-payloads-with-code-splitting

direct link

Domain: web.dev


Hey, it has json ld scripts:
  {
    "@context": "https://schema.org",
    "@type": "Article",
    "dateModified": "2018-11-05",
    "headline": "Reduce JavaScript payloads with code splitting"
  }
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [{
      "@type": "ListItem",
      "position": 1,
      "name": "Articles",
      "item": "https://web.dev/articles"
    },{
      "@type": "ListItem",
      "position": 2,
      "name": "Reduce JavaScript payloads with code splitting",
      "item": "https://web.dev/articles/reduce-javascript-payloads-with-code-splitting"
    }]
  }
  

google-signin-client-id157101835696-ooapojlodmuabs2do2vuhhnf90bccmoi.apps.googleusercontent.com
google-signin-scopeprofile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award https://www.googleapis.com/auth/devprofiles.full_control.firstparty
og:site_nameweb.dev
og:typewebsite
theme-color#3740ff
NoneIE=Edge
og:localeen

Links:

Skip to main content https://web.dev/articles/reduce-javascript-payloads-with-code-splitting#main-content
https://web.dev/
Resources https://web.dev/explore/ai
HTML https://web.dev/html
CSS https://web.dev/css
JavaScript https://web.dev/javascript
Performance https://web.dev/performance
Accessibility https://web.dev/accessibility
Identity https://web.dev/identity
Learn HTML https://web.dev/learn/html
Learn CSS https://web.dev/learn/css
Learn JavaScript https://web.dev/learn/javascript
Learn AI https://web.dev/learn/ai
Learn Performance https://web.dev/learn/performance
Learn Accessibility https://web.dev/learn/accessibility
More courses https://web.dev/learn
AI and the web https://web.dev/explore/ai
Explore https://web.dev/explore
PageSpeed Insights https://pagespeed.web.dev/
Patterns https://web.dev/patterns
Podcasts & shows https://web.dev/shows
Developer Newsletter https://web.dev/newsletter
About web.dev https://web.dev/about
Discover https://web.dev/discover
Baseline https://web.dev/baseline
How to use Baseline https://web.dev/how-to-use-baseline
Blog https://web.dev/blog
Case Studies https://web.dev/case-studies
Articles https://web.dev/articles
AI and the web https://web.dev/explore/ai
Fast load times https://web.dev/explore/fast
Learn Core Web Vitals https://web.dev/explore/learn-core-web-vitals
Identity https://web.dev/identity
Progressive Web Apps https://web.dev/explore/progressive-web-apps
Payments https://web.dev/explore/payments
Notifications https://web.dev/explore/notifications
How to optimize INP https://web.dev/explore/how-to-optimize-inp
Network reliability https://web.dev/explore/reliable
React https://web.dev/explore/react
Animations https://web.dev/explore/animations
Mini apps https://web.dev/explore/mini-apps
Media https://web.dev/explore/media
Safe and secure https://web.dev/explore/secure
WebAssembly https://web.dev/explore/webassembly
Devices https://web.dev/explore/devices
Easily discoverable https://web.dev/explore/discoverable
Test automation https://web.dev/explore/test-automation
Angular https://web.dev/explore/angular
https://web.dev/
Resources https://web.dev/explore/ai
AI and the web https://web.dev/explore/ai
Fast load times https://web.dev/explore/fast
Learn Core Web Vitals https://web.dev/explore/learn-core-web-vitals
Identity https://web.dev/identity
Progressive Web Apps https://web.dev/explore/progressive-web-apps
Payments https://web.dev/explore/payments
Notifications https://web.dev/explore/notifications
How to optimize INP https://web.dev/explore/how-to-optimize-inp
Network reliability https://web.dev/explore/reliable
React https://web.dev/explore/react
Animations https://web.dev/explore/animations
Mini apps https://web.dev/explore/mini-apps
Media https://web.dev/explore/media
Safe and secure https://web.dev/explore/secure
WebAssembly https://web.dev/explore/webassembly
Devices https://web.dev/explore/devices
Easily discoverable https://web.dev/explore/discoverable
Test automation https://web.dev/explore/test-automation
Angular https://web.dev/explore/angular
Discover https://web.dev/discover
Baseline https://web.dev/baseline
How to use Baseline https://web.dev/how-to-use-baseline
Blog https://web.dev/blog
Case Studies https://web.dev/case-studies
Why does speed matter?https://web.dev/articles/why-speed-matters
What is speed?https://web.dev/articles/what-is-speed
How to measure speed?https://web.dev/articles/how-to-measure-speed
How to stay fast?https://web.dev/articles/how-to-stay-fast
Web Vitalshttps://web.dev/articles/vitals
User-centric performance metricshttps://web.dev/articles/user-centric-performance-metrics
Defining the Core Web Vitals metrics thresholdshttps://web.dev/articles/defining-core-web-vitals-thresholds
Largest Contentful Paint (LCP)https://web.dev/articles/lcp
Cumulative Layout Shift (CLS)https://web.dev/articles/cls
Interaction to Next Paint (INP)https://web.dev/articles/inp
Optimize Largest Contentful Painthttps://web.dev/articles/optimize-lcp
Optimize Cumulative Layout Shifthttps://web.dev/articles/optimize-cls
Optimize Interaction to Next Painthttps://web.dev/articles/optimize-inp
The most effective ways to improve Core Web Vitalshttps://web.dev/articles/top-cwv
Core Web Vitals workflows with Google toolshttps://web.dev/articles/vitals-tools
Optimizing Core Web Vitals for business decision makershttps://web.dev/articles/optimize-cwv-business
Using the Chrome UX Report to look at performance in the fieldhttps://web.dev/articles/chrome-ux-report
Why lab and field data can be different (and what to do about it)https://web.dev/articles/lab-and-field-data-differences
Why is CrUX data different from my RUM data?https://web.dev/articles/crux-and-rum-differences
Optimize Time to First Bytehttps://web.dev/articles/optimize-ttfb
Content delivery networks (CDNs)https://web.dev/articles/content-delivery-networks
Prioritize resourceshttps://web.dev/articles/prioritize-resources
Preload critical assets to improve loading speedhttps://web.dev/articles/preload-critical-assets
Establish network connections early to improve perceived page speedhttps://web.dev/articles/preconnect-and-dns-prefetch
Prefetch resources to speed up future navigationshttps://web.dev/articles/link-prefetch
Fast playback with audio and video preloadhttps://web.dev/articles/fast-playback-with-preload
Adaptive serving based on network qualityhttps://web.dev/articles/adaptive-serving-based-on-network-quality
Choose the right image formathttps://web.dev/articles/choose-the-right-image-format
Choose the correct level of compressionhttps://web.dev/articles/compress-images
Use Imagemin to compress imageshttps://web.dev/articles/use-imagemin-to-compress-images
Replace animated GIFs with video for faster page loadshttps://web.dev/articles/replace-gifs-with-videos
Serve responsive imageshttps://web.dev/articles/serve-responsive-images
Serve images with correct dimensionshttps://web.dev/articles/serve-images-with-correct-dimensions
Use WebP imageshttps://web.dev/articles/serve-images-webp
Use image CDNs to optimize imageshttps://web.dev/articles/image-cdns
Browser-level image lazy loading for the webhttps://web.dev/articles/browser-level-image-lazy-loading
Best practices for fontshttps://web.dev/articles/font-best-practices
Avoid invisible text during font loadinghttps://web.dev/articles/avoid-invisible-text
Optimize web font loading and renderinghttps://web.dev/articles/optimize-webfont-loading
Reduce web font sizehttps://web.dev/articles/reduce-webfont-size
Defer non-critical CSShttps://web.dev/articles/defer-non-critical-css
Minify CSShttps://web.dev/articles/minify-css
Extract critical CSShttps://web.dev/articles/extract-critical-css
Optimize CSS background images with media querieshttps://web.dev/articles/optimize-css-background-images-with-media-queries
Third-party JavaScript performancehttps://web.dev/articles/third-party-javascript
Identify slow third-party JavaScripthttps://web.dev/articles/identify-slow-third-party-javascript
Efficiently load third-party JavaScripthttps://web.dev/articles/efficiently-load-third-party-javascript
Best practices for tags and tag managershttps://web.dev/articles/tag-best-practices
Optimize long taskshttps://web.dev/articles/optimize-long-tasks
Optimize Interaction to Next Painthttps://web.dev/articles/optimize-inp
Apply instant loading with the PRPL patternhttps://web.dev/articles/apply-instant-loading-with-prpl
Reduce JavaScript payloads with code splittinghttps://web.dev/articles/reduce-javascript-payloads-with-code-splitting
Remove unused codehttps://web.dev/articles/remove-unused-code
Minify and compress network payloadshttps://web.dev/articles/reduce-network-payloads-using-text-compression
How CommonJS is making your bundles largerhttps://web.dev/articles/commonjs-larger-bundles
The value of speedhttps://web.dev/articles/value-of-speed
How can performance improve conversion?https://web.dev/articles/how-can-performance-improve-conversion
What should you measure to improve performance?https://web.dev/articles/what-should-you-measure-to-improve-performance
Fixing website speed cross-functionallyhttps://web.dev/articles/fixing-website-speed-cross-functionally
Relating site speed and business metricshttps://web.dev/articles/site-speed-and-business-metrics
Performance budgets 101https://web.dev/articles/performance-budgets-101
Your first performance budgethttps://web.dev/articles/your-first-performance-budget
Incorporate performance budgets into your build processhttps://web.dev/articles/incorporate-performance-budgets-into-your-build-tools
Use Lighthouse for performance budgetshttps://web.dev/articles/use-lighthouse-for-performance-budgets
Using bundlesize with Travis CIhttps://web.dev/articles/using-bundlesize-with-travis-ci
Using Lighthouse Bot to set a performance budgethttps://web.dev/articles/using-lighthouse-bot-to-set-a-performance-budget
Performance monitoring with Lighthouse CIhttps://web.dev/articles/lighthouse-ci
HTML https://web.dev/html
CSS https://web.dev/css
JavaScript https://web.dev/javascript
Performance https://web.dev/performance
Accessibility https://web.dev/accessibility
Identity https://web.dev/identity
Learn HTML https://web.dev/learn/html
Learn CSS https://web.dev/learn/css
Learn JavaScript https://web.dev/learn/javascript
Learn AI https://web.dev/learn/ai
Learn Performance https://web.dev/learn/performance
Learn Accessibility https://web.dev/learn/accessibility
More courses https://web.dev/learn
AI and the web https://web.dev/explore/ai
Explore https://web.dev/explore
PageSpeed Insights https://pagespeed.web.dev/
Patterns https://web.dev/patterns
Podcasts & shows https://web.dev/shows
Developer Newsletter https://web.dev/newsletter
About web.dev https://web.dev/about
Home https://web.dev/
Articles https://web.dev/articles
Resources https://web.dev/explore/ai
Fast load times https://web.dev/explore/fast
X https://twitter.com/hdjirdeh
GitHub https://github.com/housseindjirdeh
Homepage https://houssein.me/
GitHub https://github.com/malchata
LinkedIn https://www.linkedin.com/in/malchata
Homepage https://jlwagner.net/
Over 50% of users abandon a website if it takes longer than 3 seconds to loadhttps://www.thinkwithgoogle.com/intl/en-154/insights-inspiration/research-data/need-mobile-speed-how-mobile-latency-impacts-publisher-revenue/
interactive fasterhttps://web.dev/articles/tti
Core Web Vitalshttps://web.dev/articles/vitals
Interaction to Next Paint (INP)https://web.dev/articles/inp
Largest Contentful Paint (LCP)https://web.dev/articles/lcp
delayed in being discovered by the browserhttps://web.dev/articles/optimize-lcp#optimize_when_the_resource_is_discovered
render that LCP elementhttps://web.dev/articles/optimize-lcp#2_eliminate_element_render_delay
Server-Side Rendering (SSR)https://web.dev/articles/rendering-on-the-web#server-side_rendering
the browser preload scannerhttps://web.dev/articles/preload-scanner
more effectivelyhttps://web.dev/articles/preload-scanner#rendering_markup_with_client-side_javascript
webpackhttps://webpack.js.org/guides/code-splitting/
Parcelhttps://parceljs.org/code_splitting.html
Rolluphttps://rollupjs.org/guide/en#dynamic-import
dynamic importshttps://v8.dev/features/dynamic-import
preload critical chunks to prioritize and fetch them soonerhttps://web.dev/articles/preload-critical-assets
SplitChunksPluginhttps://webpack.js.org/plugins/split-chunks-plugin/
Creative Commons Attribution 4.0 Licensehttps://creativecommons.org/licenses/by/4.0/
Apache 2.0 Licensehttps://www.apache.org/licenses/LICENSE-2.0
Google Developers Site Policieshttps://developers.google.com/site-policies
File a bug https://issuetracker.google.com/issues/new?component=1400680&template=1857359
See open issues https://issuetracker.google.com/issues?q=status:open%20componentid:1400680&s=created_time:desc
Chrome for Developers https://developer.chrome.com/
Chromium updates https://blog.chromium.org/
Case studies https://web.dev/case-studies
Podcasts & shows https://web.dev/shows
@ChromiumDev on X https://twitter.com/ChromiumDev
YouTube https://www.youtube.com/user/ChromeDevelopers
Chrome for Developers on LinkedIn https://www.linkedin.com/showcase/chrome-for-developers
RSS https://web.dev/static/blog/feed.xml
Terms https://policies.google.com/terms
Privacy https://policies.google.com/privacy
Manage cookies https://web.dev/articles/reduce-javascript-payloads-with-code-splitting

Viewport: width=device-width, initial-scale=1


URLs of crawlers that visited me.