This course has been updated! We now recommend you take the Intermediate React, v5 course.
Transcript from the "Code Splitting Without Loadable" Lesson
[00:00:00]
>> Brian: So that's code splitting. I've given you all the tools now pretty much to do whatever you want with the code splitting. It doesn't really get a lot more complicated than that. It really is, if we're looking at our code here, here in details,. This is the key right here.
[00:00:16] It's this import function right here. This is just signaling to
>> Brian: Parcel to go out and fetch this and then this returns a promise. And when you call dot then on the promise this will give you the module inside of the promise body. That's just how it works.
[00:00:34] So now, it's not any more complicated than that. We could actually write this ourselves. And in fact, in version three of this, I make you write it yourself cuz it really isn't very complicated. Probably even just pull it up here real quick. Complete intro to react.
>> Brian: Let's see.
[00:00:52] Repo.
>> Brian: And if you look in the js here, Async Route here, this one .jsx file. This is about it. So on component to mount, you take the loading promise and call dot then when the module finally arrives. And I just set this dot component equals module dot default, and then you set, this is loaded, and then down here.
[00:01:24] If it's loading you show the spinner. If it's not loading then you show the component.
>> Brian: So loadable does a little bit more. It has retry logic and some other fancy stuff, but at its core, it's nothing more than this.
>> Brian: In other words, you could write this, right?
[00:01:44] And you could write loadables. There's no black magic here.
>> Brian: So again, if you actually wanna go through that process just check out the version three of this course. Last thing about code splitting.
>> Brian: If you need to check out the branch and see this later, it's the name of the branch is code dash splitting.
[00:02:09] And that is at the bottom of that page. Of the codes splitting in the course notes.