Exploring the Benefits of XHP for PHP/Hack Development
XHP is a powerful tool for PHP/Hack development, combining the advantages of JSX and React components into one package. Learn more about the benefits of XHP and how it can improve your development process.
дэн
the results are always perfect
-
after the mess of early PHP code, much of the world has moved to “separating” view and controller. view templates in separate files, logic separately. but this is not what happened at FB. there, XHP fixed that. XHP is like JSX + React component model, but for PHP/Hack.
— дэн (@dan_abramov) April 19, 2023 -
so the “server” era Facebook code did not actually look at all like what you would see in the server code of the pre-React generation of most web development. it was not a bunch of controllers or template files. no, it was components! components that could do data fetching.
— дэн (@dan_abramov) April 19, 2023 -
yes, they were written in a dialect of PHP with progressively more and more strong typing (Hack). but they used statically-checked XML-like syntax for the tree, just like JSX (in fact, that’s *the* precursor to JSX). but they could render other components! they could pass props!
— дэн (@dan_abramov) April 19, 2023 -
coupling XHP with data fetching was not there at first. it was added around 2010 and was mildly controversial. it’s one of those “hall of fame” diffs at FB where comments start with “i don’t understand what problem this is solving” and later “talked in person and we’re convinced”
— дэн (@dan_abramov) April 19, 2023 -
curiously you could even render React components from XHP. that was actually the initial way you would try React at Facebook. render <React:MyComponentName /> inside your XHP tree. (you could say your React component is a ... client component).
— дэн (@dan_abramov) April 19, 2023 -
of course, it was pretty limited. it could render a tree once, but since it rendered to HTML, it could not re-render without blowing away the page. so there was a “handoff” to the client of which React was gradually “eating” more (until React took over the top level).
— дэн (@dan_abramov) April 19, 2023 -
still, it had great insights. colocating data fetching with components is good. letting it happen deep in tree rather than in “controllers” is good. streaming content as its code, data, and styling is being resolved in parallel with intentionally designed loading states is good.
— дэн (@dan_abramov) April 19, 2023 -
at FB, XHP was the original alternative to MVC for the server, and React was the alternative to MVC for the client. similar in spirit but divided by technology.
— дэн (@dan_abramov) April 19, 2023
in open source, alternatives to client MVC are well-known but server MVC is still taken for granted as “the” way. -
all of this is to say is, React Server Components is our alternative to MVC for the server. it’s like XHP but it’s 100% native to React and answers modern needs. you’ve only seen half the thing; this is the entire thing.https://t.co/r7qAdnH90L
— дэн (@dan_abramov) April 19, 2023 -
of course RSC is not influenced by XHP alone. you will find pieces of Next.js getInitialProps, our internal native app frameworks that mostly run on the server, ideas and techniques from Relay. we have a Credits and Prior Art section here. https://t.co/wqHt9Y5wi1
— дэн (@dan_abramov) April 19, 2023