# Optimising BBC Online's Code Splitting Strategy

DevFeed: [Optimising BBC Online's Code Splitting Strategy](<https://devfeed.tech/articles/optimising-bbc-online-s-code-splitting-strategy-19174.md>)

Original publisher: [Read original article](<https://medium.com/bbc-product-technology/optimising-bbc-onlines-code-splitting-strategy-eb17172dea44?source=rss----ccd524e1760a---4>)

Author: Matt Williams

Published: 2022-05-30T15:21:09Z

Content type: article

Language: en

Sources: [BBC](<https://devfeed.tech/sources/bbc.md>)

Topics: [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Code](<https://devfeed.tech/topics/code.md>), [Website](<https://devfeed.tech/topics/website.md>), [modern web development](<https://devfeed.tech/topics/modern-web-development.md>)

Tags: [code](<https://devfeed.tech/tags/code.md>), [code-splitting](<https://devfeed.tech/tags/code-splitting.md>), [frameworks](<https://devfeed.tech/tags/frameworks.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [performance](<https://devfeed.tech/tags/performance.md>), [react](<https://devfeed.tech/tags/react.md>), [webpack](<https://devfeed.tech/tags/webpack.md>), [website](<https://devfeed.tech/tags/website.md>)

## AI overview

This article explains BBC Online's code-splitting strategy for a large JavaScript website. It describes how splitting code into separate files can support parallel downloads and limit page-specific code to the pages that need it, while noting that excessive fragmentation can cause problems. The article says BBC Online's Presentation Layer had outgrown its existing strategy and introduces its use of shared core bundles.

## Source excerpt

Photo by Sen on Unsplash Modern JavaScript websites are the result of complex code bases, and the code base which powers BBC Online is no exception. There are many dependencies and frameworks that we rely upon in order to provide the functionality that our end-users expect, as well as code written in-house to cater to the needs of our website and its users; being able to click a button to follow a topic, search for content and play videos all require JavaScript code to be run by the browser. For a website as large and with as many seemingly disparate needs as the BBC's various pages, the amount of code required can grow exponentially. The code needed to render a news article - with images, social media embeds, videos and onward journeys - has only small elements of commonality with the code required to power complex sports data tables - with team badges, functionality to hide or show columns based on the screen width of the user's device, display a team's form, or provide live in-page updates for events that are happening live. As such, it has long been the practice of the JavaScript community to implement code splitting. Rather than providing all of our JavaScript and dependencies into a single large file to be downloaded by the user, we can split our code into separate files. This can provide advantages on two fronts; downloading multiple smaller files can be more efficient when devices can start those downloads in parallel (though going too far and downloading too many small files can cause problems itself!), and the way that we choose to split our files can mean that some only need to be downloaded on certain pages. It is this second benefit which can be most powerful; if you have a large piece of code on your site that is only needed for a single page, then forcing users to download that code on every page is wasteful, and can cause problems for users who might have limits on the amount of data they can download on their network. We have been using code splitti