8 ms·

React 15.4

173 points by spicyj 10y ago

msoad 10y ago
Query parameter for enabling timeline recording seems wrong. My app will remove that query parameter because it's unknown to the server
- faceyspacey 10y ago
  Agreed. There should be a function u can call in the console as a fallback similar to Perfect.start(). I bet there is, they just didn't publicize it.
  - ggregoire 10y ago
    The PR: https://github.com/facebook/react/pull/7549 https://github.com/facebook/react/pull/7549
    - Cafey 10y ago
      I don't see the location.search (or toggle) used anywhere in this PR :( edit: 'isProfiling' is used but never declared so it most likely already was a toggle they used.
      - evan_ 10y ago
        They use window.location.href with a regex here: https://github.com/facebook/react/blob/e612826650ff68e73bff4d71db01fea8147ee1fd/src/renderers/shared/ReactDebugTool.js#L414 https://github.com/facebook/react/blob/e612826650ff68e73bff4...
  - benjaminjackman 10y ago
    `ReactPerf.start()`
  - danabramov 10y ago
    There is, ?react_perf is exactly the same as ReactPerf.start().
- jannotti 10y ago
  Does it remove it and redirect? If not, you're fine. I think that's why something like this is chosen. Your (server) app will rightly ignore that query parameter, but you'll probably still serve up the page. React is client-side, so it will still see it in the url. Everyone should be happy.
HugoDaniel 10y ago
wow visualizing React components timings in the Chrome Timeline seems really cool. must try it out :)
joshjg 10y ago
Was looking forward to better chrome timeline integration, great!
- davidus2 10y ago
  absolutely
netcommentator 10y ago
If you use Typescript you can get most of the benefits of React from this little library: https://github.com/wisercoder/uibuilder https://github.com/wisercoder/uibuilder It doesn't support fine-grained screen update but you get support for Web Components (Polymer) which React doesn't support. Facebook is being arrogant by not supporting the Web Components W3 standard.
- Cafey 10y ago
  For me the best asset of React is not having to manipulate the DOM directly with jQuery, which in my experience leads to code that injects DOM elements from everywhere making it very difficult to maintain. This is certainly not a replacement.
  - netcommentator 10y ago
    You can divide your page into multiple components, then to update the screen replace the components that contain stale data. You do not have to deal with elements--you only have to deal with components. Regardless of which library you use there is nothing preventing you from injecting DOM elements from everywhere. Only discipline can prevent that.
    - untog 10y ago
      Right, but the point is that React is disciplined for you. You never do any manual HTML manipulation so you don't have to worry about injection issues.
      - netcommentator 10y ago
        You don't do manual HTML manipulation with this lib either. You can just see your page as being composed of components and replace components in order to update screen.
        untog 10y ago
Hovertruck 10y ago
Watch out for third party libraries breaking with this release. A couple that we use use were importing some modules from 'react/lib' that moved to 'react-dom/lib' such as CSSPropertyOperations.
- danabramov 10y ago
  These were always private APIs and will break many more times. Please file issues with those libraries to stop using them. We will stop exposing them completely in the future.
untog 10y ago
I like React a lot, but boy. That file size is getting pretty large: http://elijahmanor.com/react-file-size/ http://elijahmanor.com/react-file-size/ Looks to be around 45KB gzipped now, to say nothing of the parse time. It's becoming a pretty huge dependency and I wonder how much of it 90% of projects really use. Personally, I've been getting along just fine with Preact, which matches a lot of the API and is just 3KB gzipped: https://preactjs.com https://preactjs.com
- mercer 10y ago
  I'm also very happy with Preact. Apparently one approach is to use React in development and Preact in production. Could anyone who does this or knows more about this explain what React offers in development?
  - untog 10y ago
    I'd be extremely dubious of this approach, as I've been burnt before by switching things between dev and prod (like using SQLite in dev, Postgres in prod). For development, one thing that immediately comes to mind is that React has PropTypes, which help to enforce types being passed from component to component. Preact doesn't have that.
    - SamBam 10y ago
      Wouldn't that be an example of the exact reason to use React in dev and Preact in production, as OP said? PropTypes are useless in production.
      - untog 10y ago
        Yeah, it was a bad example. A better one: Preact lets you specify HTML classes using "class", React requires you to use "className". So it would be easy to trip up on that dev/prod difference. EDIT: damn it, that's a bad example as well, because it would work fine if you use React for dev (which takes className) and Preact for prod (which uses either). I still think it's a bad idea, though.
misiti3780 10y ago
reactperf looks nice and useful. thanks for the hard work!
deleted 10y ago
[deleted]
marclave 10y ago
The first time I used react was for the beta of my project http://launchaco.com/ http://launchaco.com/ One of the coolest things from this release IMO is the simulation of clicking working now! Simulate.click()
nparsons08 10y ago
We just released an updated version of Winds using React 15.4 and it works wonderfully! Looking forward to seeing the perf improvements. http://winds.getstream.io http://winds.getstream.io if you're curious to see what we're working on at GetStream.io!
- wwalser 10y ago
  What's your experience with Sails been like? I considered it for askinline.com when starting but quickly abandoned ship and ended up rolling a backing using Hapi & Sequelize. I couldn't be more satisfied with the decision. Happy to see another RSS reader get some love.

173 points by spicyj 10y ago

msoad 10y ago

Query parameter for enabling timeline recording seems wrong. My app will remove that query parameter because it's unknown to the server

faceyspacey 10y ago
Agreed. There should be a function u can call in the console as a fallback similar to Perfect.start(). I bet there is, they just didn't publicize it.
- ggregoire 10y ago
  The PR: https://github.com/facebook/react/pull/7549 https://github.com/facebook/react/pull/7549
  - Cafey 10y ago
    I don't see the location.search (or toggle) used anywhere in this PR :( edit: 'isProfiling' is used but never declared so it most likely already was a toggle they used.
    - evan_ 10y ago
      They use window.location.href with a regex here: https://github.com/facebook/react/blob/e612826650ff68e73bff4d71db01fea8147ee1fd/src/renderers/shared/ReactDebugTool.js#L414 https://github.com/facebook/react/blob/e612826650ff68e73bff4...
- benjaminjackman 10y ago
  `ReactPerf.start()`
- danabramov 10y ago
  There is, ?react_perf is exactly the same as ReactPerf.start().
jannotti 10y ago
Does it remove it and redirect? If not, you're fine. I think that's why something like this is chosen. Your (server) app will rightly ignore that query parameter, but you'll probably still serve up the page. React is client-side, so it will still see it in the url. Everyone should be happy.

HugoDaniel 10y ago

wow visualizing React components timings in the Chrome Timeline seems really cool. must try it out :)

joshjg 10y ago

Was looking forward to better chrome timeline integration, great!

davidus2 10y ago
absolutely

netcommentator 10y ago

If you use Typescript you can get most of the benefits of React from this little library: https://github.com/wisercoder/uibuilder https://github.com/wisercoder/uibuilder It doesn't support fine-grained screen update but you get support for Web Components (Polymer) which React doesn't support. Facebook is being arrogant by not supporting the Web Components W3 standard.

Cafey 10y ago
For me the best asset of React is not having to manipulate the DOM directly with jQuery, which in my experience leads to code that injects DOM elements from everywhere making it very difficult to maintain. This is certainly not a replacement.
- netcommentator 10y ago
  You can divide your page into multiple components, then to update the screen replace the components that contain stale data. You do not have to deal with elements--you only have to deal with components. Regardless of which library you use there is nothing preventing you from injecting DOM elements from everywhere. Only discipline can prevent that.
  - untog 10y ago
    Right, but the point is that React is disciplined for you. You never do any manual HTML manipulation so you don't have to worry about injection issues.
    - netcommentator 10y ago
      You don't do manual HTML manipulation with this lib either. You can just see your page as being composed of components and replace components in order to update screen.
      - untog 10y ago

Hovertruck 10y ago

Watch out for third party libraries breaking with this release. A couple that we use use were importing some modules from 'react/lib' that moved to 'react-dom/lib' such as CSSPropertyOperations.

danabramov 10y ago
These were always private APIs and will break many more times. Please file issues with those libraries to stop using them. We will stop exposing them completely in the future.

untog 10y ago

I like React a lot, but boy. That file size is getting pretty large: http://elijahmanor.com/react-file-size/ http://elijahmanor.com/react-file-size/ Looks to be around 45KB gzipped now, to say nothing of the parse time. It's becoming a pretty huge dependency and I wonder how much of it 90% of projects really use. Personally, I've been getting along just fine with Preact, which matches a lot of the API and is just 3KB gzipped: https://preactjs.com https://preactjs.com

mercer 10y ago
I'm also very happy with Preact. Apparently one approach is to use React in development and Preact in production. Could anyone who does this or knows more about this explain what React offers in development?
- untog 10y ago
  I'd be extremely dubious of this approach, as I've been burnt before by switching things between dev and prod (like using SQLite in dev, Postgres in prod). For development, one thing that immediately comes to mind is that React has PropTypes, which help to enforce types being passed from component to component. Preact doesn't have that.
  - SamBam 10y ago
    Wouldn't that be an example of the exact reason to use React in dev and Preact in production, as OP said? PropTypes are useless in production.
    - untog 10y ago
      Yeah, it was a bad example. A better one: Preact lets you specify HTML classes using "class", React requires you to use "className". So it would be easy to trip up on that dev/prod difference. EDIT: damn it, that's a bad example as well, because it would work fine if you use React for dev (which takes className) and Preact for prod (which uses either). I still think it's a bad idea, though.

misiti3780 10y ago

reactperf looks nice and useful. thanks for the hard work!

deleted 10y ago

[deleted]

marclave 10y ago

The first time I used react was for the beta of my project http://launchaco.com/ http://launchaco.com/ One of the coolest things from this release IMO is the simulation of clicking working now! Simulate.click()

nparsons08 10y ago

We just released an updated version of Winds using React 15.4 and it works wonderfully! Looking forward to seeing the perf improvements. http://winds.getstream.io http://winds.getstream.io if you're curious to see what we're working on at GetStream.io!

wwalser 10y ago
What's your experience with Sails been like? I considered it for askinline.com when starting but quickly abandoned ship and ended up rolling a backing using Hapi & Sequelize. I couldn't be more satisfied with the decision. Happy to see another RSS reader get some love.