MPAs are extra within the custom of Internet 1.0: a set of static pages linked with hyperlinks. Whereas SPAs are extra fashionable and dynamic, MPAs might be extra dependable. Whereas the 2 types are sometimes pitted in opposition to one another, the reality is many fashionable functions mix these types. Ideally, we need to maximize the strengths and decrease the weaknesses of every one. It is not uncommon to load as a lot content material as attainable statically, after which apply the dynamic components the place they make an affect. In each instances, you need to apply the most effective practices for the type you’re utilizing.
That’s the thought, anyway. However anybody who has got down to code a blended utility can let you know it will get tough quick! Astro employs an islands structure to make the hybrid format extra manageable. Islands basically divvy up the appliance format into discrete elements, which might then be loaded utilizing finest practices for the given kind of content material.
Taking the to-do app as our instance, it is smart to render any framing content material (like headings) in a manner that helps most pace and Website positioning-friendliness. Then, for the dynamic to-do listing, we have now a couple of choices. We might use a reactive framework like React in full SPA mode, during which case we’d ship the shopper belongings over after which load the information from a server API. Another choice is to make use of the identical element and pre-render it on the server, a form of middle-ground between SPA and MPA. Another choice altogether is utilizing plain JavaScript or HTMX to create and render the listing.
