-1

Javascript frameworks are not 'Search-Engine Friendly'. Search Engines has a trouble while loading the data Dynamically and finally frameworks create the markup.

This problem is resolved in React in an Isomorphic way of rendering. What is this concept actually? How is it different from Angular?

P.S. New to ReactJS. Would appreciate with more conceptualized explanations if any.

Ashfaque Rifaye
  • 1,041
  • 3
  • 13
  • 22
  • 1
    The main difference with Angular is that React SSR is currently synchronous. Any async code in components won't be rendered. You need to design an app to be synchronously hydrated with data instead of using isomorphic `fetch`. – Estus Flask Dec 09 '18 at 10:25
  • @AlirezaNoorali Post the Link if possible. Would be helpful. – Ashfaque Rifaye Dec 10 '18 at 06:34
  • Possible duplicate of [React can be used on server side rendering. What does that mean?](https://stackoverflow.com/questions/39466316/react-can-be-used-on-server-side-rendering-what-does-that-mean) – Alireza Noorali Dec 10 '18 at 06:52
  • @AlirezaNoorali No, this question is not a duplicate of the one you mention. This question has a requirement to explain the "Isomorphic" rendering concept related to ReactJS. That keyword is not even mentioned on the other post – Heroselohim Aug 08 '22 at 15:17

2 Answers2

1

ReactJS is just javascript and can run in browser but also can run in server. For example a nodejs server after an http request can run react which produces the html markup and then sends that markup to the browser. This is called react server side rendering but also some people call it universal react.

There are online tutorials/lessons about that. You can search about react server side rendering. Personally i would recommend this lesson https://www.udemy.com/server-side-rendering-with-react-and-redux/ for understanding how it works

Also because ssr is not easy, you can understand how it works but after that i would recommend using nextjs.

Eliss
  • 21
  • 1
  • 3
0

SPA frameworks by default have not good SEO because DATA come after page load with AJAX. this mean if you see Source of page 'ctrl+U' in all page title is equal and it is bad for SEO.

see this to do react SSR (server-side-rendering). in SSR data was fetched and Dom of page built.

you can use nextJs if you dont want to use pure way.

see my react SSR project for example: malltina.com

  • This is also useful: https://medium.com/@justinjung04/react-server-side-rendering-and-hot-reloading-ffb87ca81a89 – Mohmmad Ebrahimi Aval Dec 09 '18 at 06:41
  • NextJS? What is that one?@MohammedEbrahimiAval and do you mean to say, we don't have AJAX calls in ReactJS? – Ashfaque Rifaye Dec 09 '18 at 06:52
  • 1
    @AshfaqueRifaye NextJs is tools like create-react-app but base of this tools is SSR while you can not do SSR with create-react-app and you must eject it. – Mohmmad Ebrahimi Aval Dec 09 '18 at 07:23
  • 1
    @AshfaqueRifaye Isomorphic mean one code render in 2 side and mean in first time (first request) first page render in server and data fetch as http request after load page in other request data get from AJAX and in this time is like equal normal react. – Mohmmad Ebrahimi Aval Dec 09 '18 at 07:23
  • Okay. I get it. So with only Next.js, you can do SSR. You can't do SSR with just react library alone!! Thanks bro. – Ashfaque Rifaye Dec 09 '18 at 09:19
  • 1
    @AshfaqueRifaye you can use just react lib and do SSR with out any tools (pure way) but is not easy! but you can use NextJs tools to develop faster. see my first comment for pure way. – Mohmmad Ebrahimi Aval Dec 09 '18 at 09:44