From React To Preact In Seconds – Kayode Adeniyi – Medium

From React To Preact In Seconds  #react #javascript #preact #reactjs

  • From React To Preact In SecondsSo I decided to try out Preact after I heard it mentioned in an event that I attended earlier this year.
  • I didn’t want to build a new project from scratch so I looked for a simple way to transit my old React project to it.
  • So Iadded the configuration to my webpack configresolve: { ‘alias’: { ‘react’: ‘preact-compat’, ‘react-dom’: ‘preact-compat’, ‘react-addons-test-utils’: ‘preact-test-utils’, ‘preact-css-transition-group’ } }Then I installed the modules by running$ npm install -save preact preact-compat preact-test-utils version of my react module is 14.
  • xI aliased react-addons-test-utils and because I’m using the modules in my app.ResultsThe size of my app before changing to preact is shown belowWhen using reactI got the result below after changing to preactWhen using preactGotchasWhen children is not supplied to a component, preact returns an empty array while react returns undefined.
  • You may lose some capabilities of React but not likely as I’ve not lost any.ConclusionPreact is a smaller version of react and it’s code can be easily read.Preact comes with some exciting features like Linked State and so on.Make sure to test your app thoroughly before shipping.Preact documentation is quite easy to read https://preactjs.comIf you liked this, click the 💚 below so other people will see this here on Medium.

So I decided to try out Preact after I heard it mentioned in an event that I attended earlier this year. I didn’t want to build a new project from scratch so I looked for a simple way to transit my…

@ReactDOM: From React To Preact In Seconds #react #javascript #preact #reactjs

 . Below is an outline of all I did.

property in webpack. So Iadded the configuration to my webpack config

‘alias’: {

‘react’: ‘preact-compat’,

‘react-dom’: ‘preact-compat’,

‘react-addons-test-utils’: ‘preact-test-utils’,

‘react-addons-css-transition-group’: ‘preact-css-transition-group’

Then I installed the modules by running

The size of my app before changing to preact is shown below

I got the result below after changing to preact

 . This should be watched out for.

2. You may lose some capabilities of React but not likely as I’ve not lost any.

From React To Preact In Seconds – Kayode Adeniyi – Medium