Learn how to dramatically reduce your Svelte 5 and SvelteKit bundle sizes by moving heavy JavaScript libraries to the server. This video shows you how to use the Rollup Plugin Visualizer to identify bloated client bundles and optimize them using server-side load functions.
00:00:00 Introduction to JavaScript Bundle Size
00:01:50 Setting up Rollup Plugin Visualizer
00:04:21 Adding moment.js as an Example
00:06:33 Universal vs Server Load Functions
00:11:14 Comparing Bundle Sizes
array(10) {
[0]=>
object(stdClass)#5526 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "R82Ptutku0M"
["related_video_title"]=>
string(68) "Use any JavaScript or TypeScript Library in Svelte 5 (The Right Way)"
["posted_time"]=>
string(27) "5 месяцев назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
[1]=>
object(stdClass)#5499 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "vCMTxL1jWbw"
["related_video_title"]=>
string(82) "SvelteKit is the best way to build single page apps - and it just got even better!"
["posted_time"]=>
string(25) "2 месяца назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
[2]=>
object(stdClass)#5524 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "5Sm6Igq0PQM"
["related_video_title"]=>
string(66) "The hidden benefit of upgrading to Svelte 5 - smaller bundle sizes"
["posted_time"]=>
string(27) "9 месяцев назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
[3]=>
object(stdClass)#5531 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "39sIJgr7B2Y"
["related_video_title"]=>
string(53) "SvelteKit Streaming Explained: When and How to Use It"
["posted_time"]=>
string(27) "8 месяцев назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
[4]=>
object(stdClass)#5510 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "TQZGWoCzodY"
["related_video_title"]=>
string(63) "i made sveltekit boilerplate - a starter project to ship faster"
["posted_time"]=>
string(23) "1 месяц назад"
["channelName"]=>
string(7) "Elans X"
}
[5]=>
object(stdClass)#5528 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "bAAwVpvdy_g"
["related_video_title"]=>
string(68) "Why re-renders hurt performance and how you can fix them in Svelte 5"
["posted_time"]=>
string(25) "3 месяца назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
[6]=>
object(stdClass)#5523 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "eJpPNg-v0Fo"
["related_video_title"]=>
string(53) "5 Things I Wish I Knew When I Started Using SvelteKit"
["posted_time"]=>
string(19) "1 год назад"
["channelName"]=>
string(9) "Ben Davis"
}
[7]=>
object(stdClass)#5533 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "j3aliHghr3E"
["related_video_title"]=>
string(98) "Data Flow in Svelte 5 | How to fetch & pass data from the backend to the frontend in SvelteKit"
["posted_time"]=>
string(27) "7 месяцев назад"
["channelName"]=>
string(14) "Niklas Fischer"
}
[8]=>
object(stdClass)#5509 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "OlWWIbRz438"
["related_video_title"]=>
string(65) "Use Svelte 5 Snippets To Reuse Markup Without Creating Components"
["posted_time"]=>
string(27) "9 месяцев назад"
["channelName"]=>
string(11) "Joy of Code"
}
[9]=>
object(stdClass)#5527 (5) {
["video_id"]=>
int(9999999)
["related_video_id"]=>
string(11) "SIwKKgkjlbU"
["related_video_title"]=>
string(84) "Which AI models can write Svelte 5 code? I built a benchmark and tested all of them!"
["posted_time"]=>
string(25) "2 недели назад"
["channelName"]=>
string(19) "Code with Stanislav"
}
}
