Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is an isomorphic application?

I have been reading multiple different articles about what Isomorphic application is, why this type of architecture is better and so forth. But I still have a bit of uncertainty as to what is meant by such term.

How would you define what "Isomorphic Application" is, without going too much into details?

like image 379
Eduard Avatar asked Dec 28 '17 13:12

Eduard


People also ask

What is isomorphic React application?

Isomorphic React App is a web app that consists of code that can run on both server and client-side. It usually takes full advantage of performance and SEO friendliness from the server. And combine it with browser capabilities to handle complex user interactions.

What is isomorphic programming?

An isomorphism is a mapping for which an inverse mapping also exists. It's a way to describe equivalence. In programming, you often have the choice to implement a particular feature in more than one way. These alternatives may be equivalent, in which case they're isomorphic.

What is isomorphic API?

An isomorphic app is a web app that blends a server-rendered web app with a single-page application. On the one hand, we want to take advantage of fast perceived performance and SEO-friendly rendering from the server.

What does isomorphic mean in JavaScript?

Isomorphic JavaScript means that the application uses a similar rendering engine on the server and the client. This rendering method makes it easier for developers to maintain markup templates, simplifying web development. Isomorphic rendering implies the use of Node. js/Io.


Video Answer


1 Answers

They are, more recently, also called universal. I'm not sure about the whole app being called isomorphic/universal, but you can certainly have parts of the code base that is universal.

Isomorphic/universal code is code that runs on both the client (browser) and on the server (NodeJS). Since they are both JavaScript this something that is possible if:

  1. you do not mention window, document or any other browser-only methods
  2. you do not mention server, fs or any or any other node-only methods.
  3. If you do need to do the above within some code that is meant to be universal, you should wrap it in a function that either mocks the required method within the alternate environment or wrap it in conditionals so that the app doesn't crash.

An example is console.log which will work both within NodeJS and any browser, along with most other es6 methods in modern browsers.

I use build tools (like webpack) to then help create / export functions within individual files so that we then have a bundle like client-app.js which is included in the HTML file and is the browser only js. The server then might start using server-app.js which is the server-only bundle. Both bundles can be created using a lot of the same universal source code.

like image 143
peter.mouland Avatar answered Oct 10 '22 18:10

peter.mouland