[
  {
    "start": 0.0,
    "end": 3.22,
    "text": "The React team shared an update with"
  },
  {
    "start": 3.22,
    "end": 6.54,
    "text": "us, which is pretty exciting for a couple"
  },
  {
    "start": 6.54,
    "end": 7.12,
    "text": "of reasons."
  },
  {
    "start": 7.56,
    "end": 10.4,
    "text": "The first reason is that it's been some"
  },
  {
    "start": 10.4,
    "end": 14.32,
    "text": "time since we received at least an official"
  },
  {
    "start": 14.32,
    "end": 17.82,
    "text": "update, I guess, if you define official as"
  },
  {
    "start": 17.82,
    "end": 19.3,
    "text": "the React blog."
  },
  {
    "start": 19.9,
    "end": 22.04,
    "text": "That's of course not entirely true,"
  },
  {
    "start": 22.18,
    "end": 24.46,
    "text": "because the React team does also"
  },
  {
    "start": 24.46,
    "end": 26.54,
    "text": "communicate on other channels, for"
  },
  {
    "start": 26.54,
    "end": 30.22,
    "text": "example on X, but of course also"
  },
  {
    "start": 30.22,
    "end": 33.58,
    "text": "because a lot of React development"
  },
  {
    "start": 33.58,
    "end": 37.22,
    "text": "recently happened in the context of"
  },
  {
    "start": 37.22,
    "end": 41.2,
    "text": "Next.js or at least was communicated in"
  },
  {
    "start": 41.2,
    "end": 44.32,
    "text": "the context of Next.js, but I'll get back to"
  },
  {
    "start": 44.32,
    "end": 44.54,
    "text": "that."
  },
  {
    "start": 44.84,
    "end": 47.04,
    "text": "So it's pretty exciting because the last"
  },
  {
    "start": 47.04,
    "end": 50.16,
    "text": "official blog post we got on the React"
  },
  {
    "start": 50.16,
    "end": 55.62,
    "text": "blog was on May the 3rd, 2023, so almost"
  },
  {
    "start": 55.62,
    "end": 59.32,
    "text": "a year ago, and now on February 15th,"
  },
  {
    "start": 59.34,
    "end": 62.42,
    "text": "2024, we got another blog post, another"
  },
  {
    "start": 62.42,
    "end": 64.42,
    "text": "update and a pretty exciting one,"
  },
  {
    "start": 64.599,
    "end": 67.94,
    "text": "because in this update we learn a lot"
  },
  {
    "start": 67.94,
    "end": 71.42,
    "text": "about the relatively near future of React,"
  },
  {
    "start": 71.7,
    "end": 74.88,
    "text": "about React version 19, which will be the"
  },
  {
    "start": 74.88,
    "end": 78.38,
    "text": "next major version of React, and about"
  },
  {
    "start": 78.38,
    "end": 80.7,
    "text": "some exciting features that will be"
  },
  {
    "start": 80.7,
    "end": 82.12,
    "text": "included in that version."
  },
  {
    "start": 82.52,
    "end": 85.5,
    "text": "In addition, there is the announcement, I"
  },
  {
    "start": 85.5,
    "end": 88.46,
    "text": "guess, of React Conf 2024, which is"
  },
  {
    "start": 88.46,
    "end": 92.08,
    "text": "scheduled for May 15th and 16th this"
  },
  {
    "start": 92.08,
    "end": 94.22,
    "text": "year, but of course that's not the main"
  },
  {
    "start": 94.22,
    "end": 95.34,
    "text": "thing of that blog post."
  },
  {
    "start": 95.44,
    "end": 97.96,
    "text": "Instead, in that blog post, where we"
  },
  {
    "start": 97.96,
    "end": 100.26,
    "text": "learn more about React's near future,"
  },
  {
    "start": 100.86,
    "end": 104.84,
    "text": "the main topic probably is the new"
  },
  {
    "start": 104.84,
    "end": 108.14,
    "text": "React compiler on which the React team"
  },
  {
    "start": 108.14,
    "end": 109.88,
    "text": "has been working for a while now."
  },
  {
    "start": 110.58,
    "end": 113.2,
    "text": "Now, this React compiler is called"
  },
  {
    "start": 113.2,
    "end": 116.28,
    "text": "react-forget, and the idea behind this"
  },
  {
    "start": 116.28,
    "end": 120.7,
    "text": "compiler is that it will take a look at your"
  },
  {
    "start": 120.7,
    "end": 124.72,
    "text": "React code, essentially, and it will try to"
  },
  {
    "start": 124.72,
    "end": 127.36,
    "text": "do memoization for you."
  },
  {
    "start": 127.68,
    "end": 128.96,
    "text": "Now, what does this mean?"
  },
  {
    "start": 129.539,
    "end": 133.1,
    "text": "Well, in React, as of today, without that"
  },
  {
    "start": 133.1,
    "end": 136.02,
    "text": "compiler, you sometimes have to use"
  },
  {
    "start": 136.02,
    "end": 139.14,
    "text": "the useMemo hook or the useCallback"
  },
  {
    "start": 139.14,
    "end": 143.24,
    "text": "hook or the memo function to wrap"
  },
  {
    "start": 143.24,
    "end": 146.6,
    "text": "logic or components to make sure that"
  },
  {
    "start": 146.6,
    "end": 149.42,
    "text": "they don't re-render unnecessarily,"
  },
  {
    "start": 149.82,
    "end": 153.04,
    "text": "because the way React works, it can"
  },
  {
    "start": 153.04,
    "end": 155.48,
    "text": "actually render components and"
  },
  {
    "start": 155.48,
    "end": 158.58,
    "text": "re-evaluate components unnecessarily"
  },
  {
    "start": 158.58,
    "end": 162.26,
    "text": "because it doesn't always understand if"
  },
  {
    "start": 162.26,
    "end": 166.14,
    "text": "a re-evaluation cycle is necessary or not,"
  },
  {
    "start": 166.56,
    "end": 168.46,
    "text": "and you therefore have to use these"
  },
  {
    "start": 168.46,
    "end": 171.48,
    "text": "hooks and so on to tell it that some value"
  },
  {
    "start": 171.48,
    "end": 173.88,
    "text": "didn't change in a certain component"
  },
  {
    "start": 173.88,
    "end": 177.14,
    "text": "and therefore no re-evaluation of that"
  },
  {
    "start": 177.14,
    "end": 179.56,
    "text": "component is needed, things like that."
  },
  {
    "start": 180.04,
    "end": 182.82,
    "text": "Now, of course, we have all these tools in"
  },
  {
    "start": 182.82,
    "end": 185.22,
    "text": "React, though, so why do we need a"
  },
  {
    "start": 185.22,
    "end": 187.62,
    "text": "compiler and what is it really about,"
  },
  {
    "start": 187.68,
    "end": 188.7,
    "text": "what is memoization?"
  },
  {
    "start": 189.46,
    "end": 191.56,
    "text": "Well, we have to use these different"
  },
  {
    "start": 191.56,
    "end": 193.96,
    "text": "tools, useMemo, useCallback, and so on,"
  },
  {
    "start": 194.1,
    "end": 197.52,
    "text": "to tell React when to not render or"
  },
  {
    "start": 197.52,
    "end": 201.36,
    "text": "re-evaluate a component, and this"
  },
  {
    "start": 201.36,
    "end": 205.02,
    "text": "compiler, react-forget, is about doing"
  },
  {
    "start": 205.02,
    "end": 208.22,
    "text": "that for us so that we don't need to use"
  },
  {
    "start": 208.22,
    "end": 211.3,
    "text": "useMemo or useCallback or the memo"
  },
  {
    "start": 211.3,
    "end": 214.96,
    "text": "function anymore, but that instead, with"
  },
  {
    "start": 214.96,
    "end": 218.4,
    "text": "help of that compiler, React is able to"
  },
  {
    "start": 218.4,
    "end": 221.24,
    "text": "know and find out whether a"
  },
  {
    "start": 221.24,
    "end": 223.3,
    "text": "component really should be"
  },
  {
    "start": 223.3,
    "end": 227.04,
    "text": "re-evaluated or not, so that React gains a"
  },
  {
    "start": 227.04,
    "end": 229.58,
    "text": "deeper understanding of your code, you"
  },
  {
    "start": 229.58,
    "end": 232.12,
    "text": "could say, and therefore, with that"
  },
  {
    "start": 232.12,
    "end": 235.54,
    "text": "compiler, as a React developer, you"
  },
  {
    "start": 235.54,
    "end": 238.54,
    "text": "would have to worry less or maybe not"
  },
  {
    "start": 238.54,
    "end": 241.7,
    "text": "at all about making sure that"
  },
  {
    "start": 241.7,
    "end": 244.64,
    "text": "unnecessary re-evaluations are"
  },
  {
    "start": 244.64,
    "end": 245.2,
    "text": "prevented."
  },
  {
    "start": 245.82,
    "end": 248.3,
    "text": "The React compiler would do that for"
  },
  {
    "start": 248.3,
    "end": 249.74,
    "text": "you in that future."
  },
  {
    "start": 250.22,
    "end": 252.66,
    "text": "And that future is not too distant"
  },
  {
    "start": 252.66,
    "end": 255.76,
    "text": "because in that blog post, which the"
  },
  {
    "start": 255.6,
    "end": 258.48,
    "text": "React team shared, they also mentioned"
  },
  {
    "start": 258.48,
    "end": 261.18,
    "text": "that this React compiler is no longer a"
  },
  {
    "start": 261.18,
    "end": 263.6,
    "text": "research project, but that it instead"
  },
  {
    "start": 263.6,
    "end": 266.44,
    "text": "already powers Instagram.com in"
  },
  {
    "start": 266.44,
    "end": 269.86,
    "text": "production, so this compiler is already"
  },
  {
    "start": 269.86,
    "end": 273.22,
    "text": "being used on a large-scale project and"
  },
  {
    "start": 273.22,
    "end": 276.06,
    "text": "it seems to work quite well, otherwise"
  },
  {
    "start": 276.06,
    "end": 278.94,
    "text": "they wouldn't be announcing it here for"
  },
  {
    "start": 278.94,
    "end": 282.04,
    "text": "all React developers in the near future."
  },
  {
    "start": 282.68,
    "end": 284.62,
    "text": "Now, it's also worth noting and"
  },
  {
    "start": 284.64,
    "end": 288.34,
    "text": "mentioned in this official blog post that"
  },
  {
    "start": 288.34,
    "end": 290.82,
    "text": "this compiler and the existence of that"
  },
  {
    "start": 290.82,
    "end": 293.82,
    "text": "compiler will not change the general"
  },
  {
    "start": 293.82,
    "end": 297.8,
    "text": "React mental model, where the UI is"
  },
  {
    "start": 297.8,
    "end": 302.02,
    "text": "essentially a function of your data and"
  },
  {
    "start": 302.02,
    "end": 302.72,
    "text": "your state."
  },
  {
    "start": 302.86,
    "end": 306.88,
    "text": "That will not change, it's just meant to"
  },
  {
    "start": 306.88,
    "end": 311.08,
    "text": "decrease the complexity of the code you"
  },
  {
    "start": 311.08,
    "end": 313.92,
    "text": "have to write, or at least get rid of that"
  },
  {
    "start": 313.92,
    "end": 316.5,
    "text": "extra work you had to do regarding"
  },
  {
    "start": 316.5,
    "end": 319.06,
    "text": "those unnecessary render cycles that"
  },
  {
    "start": 319.06,
    "end": 320.18,
    "text": "needed to be prevented."
  },
  {
    "start": 320.62,
    "end": 322.64,
    "text": "Which of course also was not just"
  },
  {
    "start": 322.64,
    "end": 325.34,
    "text": "annoying, but also a potential source for"
  },
  {
    "start": 325.34,
    "end": 328.3,
    "text": "bugs and problems, so it's great if we"
  },
  {
    "start": 328.3,
    "end": 329.3,
    "text": "get some help there."
  },
  {
    "start": 329.68,
    "end": 331.9,
    "text": "Now, they also mentioned in that blog"
  },
  {
    "start": 331.9,
    "end": 335.32,
    "text": "post that in order for this compiler to"
  },
  {
    "start": 335.32,
    "end": 339.04,
    "text": "really work well, you must make sure"
  },
  {
    "start": 339.04,
    "end": 343.14,
    "text": "that the React code you write follows"
  },
  {
    "start": 343.14,
    "end": 346.56,
    "text": "certain rules or best practices, and"
  },
  {
    "start": 346.56,
    "end": 348.7,
    "text": "therefore the React team recommends"
  },
  {
    "start": 348.7,
    "end": 352.52,
    "text": "that if you want to make sure that you"
  },
  {
    "start": 352.52,
    "end": 355.72,
    "text": "follow React's rules, you enable strict"
  },
  {
    "start": 355.72,
    "end": 358.94,
    "text": "mode in your React projects and that"
  },
  {
    "start": 358.94,
    "end": 363.42,
    "text": "you use React's ESLint plugin, so that"
  },
  {
    "start": 363.42,
    "end": 366.88,
    "text": "you get early warnings if somewhere in"
  },
  {
    "start": 366.88,
    "end": 369.88,
    "text": "your code you have code that technically"
  },
  {
    "start": 369.88,
    "end": 373.54,
    "text": "works, but is not optimal, because that"
  },
  {
    "start": 373.54,
    "end": 376.0,
    "text": "code then might not be handled by the"
  },
  {
    "start": 376.0,
    "end": 378.06,
    "text": "compiler in the best possible way."
  },
  {
    "start": 378.48,
    "end": 381.36,
    "text": "Though it's also worth mentioning that"
  },
  {
    "start": 381.36,
    "end": 384.96,
    "text": "the compiler, as it sounds from that blog"
  },
  {
    "start": 384.88,
    "end": 389.08,
    "text": "post at least, will work such that it"
  },
  {
    "start": 389.08,
    "end": 392.82,
    "text": "doesn't crash if somewhere in your code"
  },
  {
    "start": 392.82,
    "end": 395.6,
    "text": "you have code that can't be analyzed"
  },
  {
    "start": 395.6,
    "end": 399.4,
    "text": "and optimized automatically, it just"
  },
  {
    "start": 399.4,
    "end": 401.82,
    "text": "won't be able to do anything with that"
  },
  {
    "start": 401.82,
    "end": 402.62,
    "text": "code instead."
  },
  {
    "start": 403.04,
    "end": 405.28,
    "text": "So it will skip compilation if it"
  },
  {
    "start": 405.28,
    "end": 407.44,
    "text": "determines that it isn't safe to compile"
  },
  {
    "start": 407.44,
    "end": 408.02,
    "text": "your code."
  },
  {
    "start": 408.4,
    "end": 410.92,
    "text": "So that's that React compiler and it's a"
  },
  {
    "start": 410.92,
    "end": 414.18,
    "text": "really exciting initiative and project and I"
  },
  {
    "start": 414.18,
    "end": 417.1,
    "text": "can't wait to start using it and hopefully"
  },
  {
    "start": 417.1,
    "end": 419.8,
    "text": "get rid of a bunch of boilerplate code in"
  },
  {
    "start": 419.8,
    "end": 420.52,
    "text": "my codebase."
  },
  {
    "start": 420.96,
    "end": 423.52,
    "text": "Now that compiler isn't everything that's"
  },
  {
    "start": 423.52,
    "end": 424.44,
    "text": "announced here though."
  },
  {
    "start": 424.68,
    "end": 426.9,
    "text": "In addition we also get more details"
  },
  {
    "start": 426.9,
    "end": 431.46,
    "text": "about actions or server actions as most"
  },
  {
    "start": 431.46,
    "end": 433.34,
    "text": "developers might know them."
  },
  {
    "start": 433.78,
    "end": 436.3,
    "text": "Though the blog post explicitly"
  },
  {
    "start": 436.3,
    "end": 439.72,
    "text": "mentions that what was previously"
  },
  {
    "start": 439.72,
    "end": 444.02,
    "text": "meant to be server actions, so a feature"
  },
  {
    "start": 444.02,
    "end": 447.42,
    "text": "that allows you to run code on the server"
  },
  {
    "start": 447.42,
    "end": 450.48,
    "text": "after a form is submitted, now actually"
  },
  {
    "start": 450.48,
    "end": 453.94,
    "text": "became actions that can be used either"
  },
  {
    "start": 453.94,
    "end": 457.16,
    "text": "on the server or also on the client, so"
  },
  {
    "start": 457.16,
    "end": 459.64,
    "text": "that this actions feature, which is about"
  },
  {
    "start": 459.64,
    "end": 462.52,
    "text": "to be added to React, will actually"
  },
  {
    "start": 462.52,
    "end": 466.02,
    "text": "simplify the process of handling form"
  },
  {
    "start": 466.02,
    "end": 468.7,
    "text": "submissions in React, even if it's just a"
  },
  {
    "start": 468.7,
    "end": 471.16,
    "text": "client-side React app without any"
  },
  {
    "start": 471.16,
    "end": 471.82,
    "text": "backend."
  },
  {
    "start": 472.48,
    "end": 474.52,
    "text": "Now this is also interesting because this"
  },
  {
    "start": 474.52,
    "end": 477.38,
    "text": "actions feature is one of those features I"
  },
  {
    "start": 477.38,
    "end": 479.76,
    "text": "mentioned about which we mostly"
  },
  {
    "start": 479.76,
    "end": 483.48,
    "text": "heard in the context of Next.js, because"
  },
  {
    "start": 483.48,
    "end": 486.96,
    "text": "Next.js actually introduced stable server"
  },
  {
    "start": 486.96,
    "end": 490.52,
    "text": "actions with their latest version, Next.js"
  },
  {
    "start": 490.52,
    "end": 494.36,
    "text": "14, and I do teach all about that in my"
  },
  {
    "start": 494.36,
    "end": 497.36,
    "text": "Next.js course for example, but it's"
  },
  {
    "start": 497.36,
    "end": 501.16,
    "text": "interesting to hear and see that it's now"
  },
  {
    "start": 501.16,
    "end": 503.84,
    "text": "the React team itself on their official"
  },
  {
    "start": 503.84,
    "end": 506.3,
    "text": "blog that's talking about this actions"
  },
  {
    "start": 506.3,
    "end": 509.96,
    "text": "feature and that this actions feature is a"
  },
  {
    "start": 509.96,
    "end": 513.679,
    "text": "feature that's not closely tied to Next.js"
  },
  {
    "start": 513.679,
    "end": 516.679,
    "text": "or frameworks in general, but that"
  },
  {
    "start": 516.679,
    "end": 519.419,
    "text": "instead every React developer will be"
  },
  {
    "start": 519.419,
    "end": 522.059,
    "text": "able to use it, at least that client-side"
  },
  {
    "start": 522.059,
    "end": 523.0,
    "text": "actions part."
  },
  {
    "start": 523.4,
    "end": 525.68,
    "text": "The server-side part will always be a bit"
  },
  {
    "start": 525.68,
    "end": 528.34,
    "text": "more complex because naturally you will"
  },
  {
    "start": 528.34,
    "end": 531.0,
    "text": "need a backend for that and that's"
  },
  {
    "start": 531.0,
    "end": 534.64,
    "text": "exactly what a framework like Next.js or"
  },
  {
    "start": 534.64,
    "end": 537.6,
    "text": "Remix gives you, but for client-side"
  },
  {
    "start": 537.6,
    "end": 539.72,
    "text": "applications, single-page applications,"
  },
  {
    "start": 540.08,
    "end": 542.56,
    "text": "this client-side actions part could be"
  },
  {
    "start": 542.56,
    "end": 543.64,
    "text": "really interesting."
  },
  {
    "start": 544.34,
    "end": 546.72,
    "text": "Now connected to those actions we also"
  },
  {
    "start": 546.72,
    "end": 550.42,
    "text": "get some new hooks which you can also"
  },
  {
    "start": 550.42,
    "end": 553.8,
    "text": "already use for example if you're using"
  },
  {
    "start": 553.8,
    "end": 556.2,
    "text": "Next.js because we're getting a"
  },
  {
    "start": 556.2,
    "end": 559.12,
    "text": "useFormStatus and a useFormState"
  },
  {
    "start": 559.12,
    "end": 561.66,
    "text": "hook which allow us to handle form"
  },
  {
    "start": 561.66,
    "end": 563.88,
    "text": "submissions and update the UI based on"
  },
  {
    "start": 563.88,
    "end": 566.74,
    "text": "them and so on, and a useOptimistic"
  },
  {
    "start": 566.74,
    "end": 570.04,
    "text": "hook which helps with optimistic UI"
  },
  {
    "start": 570.04,
    "end": 573.26,
    "text": "updates so that you can update the UI"
  },
  {
    "start": 573.26,
    "end": 576.28,
    "text": "the user sees even before the data has"
  },
  {
    "start": 576.28,
    "end": 578.26,
    "text": "been saved in a database, for example,"
  },
  {
    "start": 578.64,
    "end": 581.46,
    "text": "to give the user the best possible super"
  },
  {
    "start": 581.46,
    "end": 583.32,
    "text": "snappy user experience."
  },
  {
    "start": 583.98,
    "end": 586.9,
    "text": "So that's another really interesting"
  },
  {
    "start": 586.9,
    "end": 590.64,
    "text": "feature and getting more help with form"
  },
  {
    "start": 590.64,
    "end": 593.08,
    "text": "submissions and of course getting that"
  },
  {
    "start": 593.08,
    "end": 595.32,
    "text": "tighter integration with the backend,"
  },
  {
    "start": 595.76,
    "end": 597.82,
    "text": "these are really exciting developments"
  },
  {
    "start": 598.359,
    "end": 600.92,
    "text": "which will allow React developers to"
  },
  {
    "start": 600.92,
    "end": 603.42,
    "text": "build even more amazing user"
  },
  {
    "start": 603.42,
    "end": 604.74,
    "text": "experiences with ease."
  },
  {
    "start": 605.599,
    "end": 609.26,
    "text": "Now one problem React suffered from,"
  },
  {
    "start": 609.4,
    "end": 613.1,
    "text": "at least in my opinion, is that all these"
  },
  {
    "start": 613.1,
    "end": 615.78,
    "text": "new features like React server"
  },
  {
    "start": 615.78,
    "end": 618.92,
    "text": "components, for example, also were"
  },
  {
    "start": 618.92,
    "end": 621.62,
    "text": "developed and published on the canary"
  },
  {
    "start": 621.62,
    "end": 623.18,
    "text": "branch of React."
  },
  {
    "start": 623.42,
    "end": 625.68,
    "text": "So not on the latest stable or main"
  },
  {
    "start": 625.68,
    "end": 628.88,
    "text": "branch but on a special branch or"
  },
  {
    "start": 628.88,
    "end": 632.5,
    "text": "channel I should say that could be used"
  },
  {
    "start": 632.5,
    "end": 636.64,
    "text": "by every React developer but not really"
  },
  {
    "start": 636.64,
    "end": 640.88,
    "text": "in an easy way I would say or at least this"
  },
  {
    "start": 640.88,
    "end": 643.96,
    "text": "canary branch was mainly intended to"
  },
  {
    "start": 643.96,
    "end": 647.02,
    "text": "be used by framework developers which"
  },
  {
    "start": 647.02,
    "end": 649.44,
    "text": "is why many of the features published"
  },
  {
    "start": 649.44,
    "end": 652.7,
    "text": "through that channel were available in"
  },
  {
    "start": 652.7,
    "end": 656.28,
    "text": "Next.js and were marked as stable there"
  },
  {
    "start": 656.28,
    "end": 658.7,
    "text": "even though they were not marked as"
  },
  {
    "start": 658.7,
    "end": 661.68,
    "text": "stable in React itself which was a bit"
  },
  {
    "start": 661.68,
    "end": 665.0,
    "text": "confusing at least for me and as far as I"
  },
  {
    "start": 665.0,
    "end": 667.4,
    "text": "can tell also for many other React"
  },
  {
    "start": 667.4,
    "end": 667.94,
    "text": "developers."
  },
  {
    "start": 668.9,
    "end": 671.84,
    "text": "Now that will change as it seems with"
  },
  {
    "start": 671.84,
    "end": 675.1,
    "text": "the next major version or at least that"
  },
  {
    "start": 675.1,
    "end": 679.02,
    "text": "next major version React 19 which is"
  },
  {
    "start": 679.02,
    "end": 682.36,
    "text": "about to be released later in 2024 as it"
  },
  {
    "start": 682.36,
    "end": 686.48,
    "text": "seems that version seems to bundle a"
  },
  {
    "start": 686.48,
    "end": 689.58,
    "text": "lot of features that have all been stuck in"
  },
  {
    "start": 689.58,
    "end": 692.98,
    "text": "this canary channel for example the use"
  },
  {
    "start": 692.98,
    "end": 695.82,
    "text": "client and use server directives which"
  },
  {
    "start": 695.82,
    "end": 698.46,
    "text": "are needed for React server components"
  },
  {
    "start": 698.46,
    "end": 702.66,
    "text": "and also server actions so that is a huge"
  },
  {
    "start": 702.66,
    "end": 705.8,
    "text": "feature that's going to come to stable"
  },
  {
    "start": 705.8,
    "end": 708.68,
    "text": "React though it is of course worth"
  },
  {
    "start": 708.68,
    "end": 711.2,
    "text": "mentioning that if you plan on using"
  },
  {
    "start": 711.2,
    "end": 713.8,
    "text": "some server-side integrations some"
  },
  {
    "start": 713.8,
    "end": 717.06,
    "text": "back-end integrations you will still need"
  },
  {
    "start": 717.06,
    "end": 719.32,
    "text": "some framework that gives you that"
  },
  {
    "start": 719.32,
    "end": 723.62,
    "text": "integration because React itself is still a"
  },
  {
    "start": 723.62,
    "end": 726.88,
    "text": "library for rendering user interfaces in"
  },
  {
    "start": 726.88,
    "end": 728.84,
    "text": "the end it does not give you some"
  },
  {
    "start": 728.84,
    "end": 731.74,
    "text": "server-side integration out of the box"
  },
  {
    "start": 731.74,
    "end": 734.44,
    "text": "you will need to set that up on your own"
  },
  {
    "start": 734.44,
    "end": 738.3,
    "text": "or use such a framework nonetheless it's"
  },
  {
    "start": 738.3,
    "end": 742.1,
    "text": "nice to have it all in stable React itself in"
  },
  {
    "start": 742.1,
    "end": 744.56,
    "text": "the near future and we get some other"
  },
  {
    "start": 744.56,
    "end": 747.38,
    "text": "features I would guess that we get the"
  },
  {
    "start": 747.38,
    "end": 749.54,
    "text": "compiler though it's not explicitly"
  },
  {
    "start": 749.54,
    "end": 752.16,
    "text": "mentioned here in the blog post that it"
  },
  {
    "start": 752.16,
    "end": 754.04,
    "text": "will be included in the next major"
  },
  {
    "start": 754.04,
    "end": 757.3,
    "text": "version but I would guess that it is but"
  },
  {
    "start": 757.3,
    "end": 759.9,
    "text": "we'll for example also get access to some"
  },
  {
    "start": 759.9,
    "end": 763.6,
    "text": "new HTML elements that we can use in"
  },
  {
    "start": 763.6,
    "end": 767.46,
    "text": "our code HTML elements that will allow"
  },
  {
    "start": 767.46,
    "end": 772.34,
    "text": "us to easily set some head content of our"
  },
  {
    "start": 772.34,
    "end": 775.7,
    "text": "site so the title or meta tags for example"
  },
  {
    "start": 775.7,
    "end": 778.12,
    "text": "so that you don't need any third-party"
  },
  {
    "start": 778.12,
    "end": 780.6,
    "text": "packages for that anymore but it's built"
  },
  {
    "start": 780.6,
    "end": 783.7,
    "text": "into React instead we also get some new"
  },
  {
    "start": 783.7,
    "end": 786.44,
    "text": "features related to asset loading so that"
  },
  {
    "start": 786.44,
    "end": 788.62,
    "text": "React can help you with efficiently"
  },
  {
    "start": 788.62,
    "end": 793.54,
    "text": "loading fonts or CSS files and this will all"
  },
  {
    "start": 793.54,
    "end": 796.7,
    "text": "integrate with React's suspense feature"
  },
  {
    "start": 796.7,
    "end": 799.2,
    "text": "so that you can show some fallback"
  },
  {
    "start": 799.2,
    "end": 801.48,
    "text": "content whilst those assets are being"
  },
  {
    "start": 801.48,
    "end": 804.72,
    "text": "loaded so that can be useful we get"
  },
  {
    "start": 804.72,
    "end": 806.86,
    "text": "those actions which I already mentioned"
  },
  {
    "start": 806.86,
    "end": 809.96,
    "text": "they are part of that stable channel then"
  },
  {
    "start": 809.96,
    "end": 814.16,
    "text": "the client and server actions and it's also"
  },
  {
    "start": 814.16,
    "end": 816.7,
    "text": "really interesting that Andrew Clark"
  },
  {
    "start": 817.44,
    "end": 820.28,
    "text": "team member of the React team shared"
  },
  {
    "start": 820.28,
    "end": 824.54,
    "text": "a tweet or a post I guess on X where he"
  },
  {
    "start": 824.54,
    "end": 827.52,
    "text": "mentioned that by the end of 2024 we"
  },
  {
    "start": 827.52,
    "end": 831.1,
    "text": "will likely never need these APIs so these"
  },
  {
    "start": 831.1,
    "end": 834.5,
    "text": "React features again use memo use"
  },
  {
    "start": 834.5,
    "end": 836.38,
    "text": "callback and memo because of that"
  },
  {
    "start": 836.38,
    "end": 839.42,
    "text": "React compiler I mentioned forward ref"
  },
  {
    "start": 839.42,
    "end": 842.28,
    "text": "which I didn't mention yet because refs"
  },
  {
    "start": 842.28,
    "end": 846.08,
    "text": "will be accepted as standard props in"
  },
  {
    "start": 846.08,
    "end": 848.46,
    "text": "React components so if you build a"
  },
  {
    "start": 848.46,
    "end": 850.66,
    "text": "component that should accept the ref"
  },
  {
    "start": 850.66,
    "end": 853.26,
    "text": "you will no longer need to use forward"
  },
  {
    "start": 853.26,
    "end": 855.52,
    "text": "ref that seems to be another feature"
  },
  {
    "start": 855.52,
    "end": 858.96,
    "text": "that's coming with React 19 as it seems"
  },
  {
    "start": 858.96,
    "end": 863.14,
    "text": "React lazy should be made obsolete by"
  },
  {
    "start": 863.14,
    "end": 866.8,
    "text": "React server components and we'll also"
  },
  {
    "start": 866.8,
    "end": 869.68,
    "text": "get another new function the use"
  },
  {
    "start": 869.68,
    "end": 874.7,
    "text": "function I guess also with React 19 which"
  },
  {
    "start": 874.7,
    "end": 878.02,
    "text": "can be used to access context instead of"
  },
  {
    "start": 878.02,
    "end": 881.16,
    "text": "use context but which can also be used"
  },
  {
    "start": 881.16,
    "end": 884.88,
    "text": "to handle promises and build async"
  },
  {
    "start": 884.88,
    "end": 888.24,
    "text": "await like React components even if"
  },
  {
    "start": 888.24,
    "end": 890.1,
    "text": "you're not using React server"
  },
  {
    "start": 890.1,
    "end": 892.56,
    "text": "components because at the moment"
  },
  {
    "start": 892.56,
    "end": 896.78,
    "text": "with React 18 there indeed are async"
  },
  {
    "start": 896.78,
    "end": 899.12,
    "text": "components so components that can be"
  },
  {
    "start": 899.12,
    "end": 901.64,
    "text": "decorated with async await but we're"
  },
  {
    "start": 901.64,
    "end": 903.68,
    "text": "talking about server components here"
  },
  {
    "start": 903.68,
    "end": 905.64,
    "text": "so components that are rendered on the"
  },
  {
    "start": 905.64,
    "end": 908.32,
    "text": "server client only components on the"
  },
  {
    "start": 908.32,
    "end": 911.1,
    "text": "other hand can't use async await and"
  },
  {
    "start": 911.1,
    "end": 913.4,
    "text": "that's where this use function also"
  },
  {
    "start": 913.4,
    "end": 915.84,
    "text": "seems to come in the idea with that"
  },
  {
    "start": 915.84,
    "end": 919.96,
    "text": "essentially use also works a bit like await"
  },
  {
    "start": 919.96,
    "end": 923.3,
    "text": "and allows you to wait for a promise and"
  },
  {
    "start": 923.3,
    "end": 925.6,
    "text": "for the data that's produced by that"
  },
  {
    "start": 925.6,
    "end": 928.16,
    "text": "promise in client only components"
  },
  {
    "start": 928.16,
    "end": 931.32,
    "text": "which also is another nice feature and"
  },
  {
    "start": 931.32,
    "end": 934.92,
    "text": "therefore React 19 really is an upcoming"
  },
  {
    "start": 934.92,
    "end": 938.08,
    "text": "React version to be excited about and I"
  },
  {
    "start": 938.08,
    "end": 940.74,
    "text": "can't wait to see what we can build with"
  },
  {
    "start": 940.74,
    "end": 943.68,
    "text": "that version and of course it should go"
  },
  {
    "start": 943.68,
    "end": 946.86,
    "text": "without mentioning that I will keep my"
  },
  {
    "start": 946.86,
    "end": 950.36,
    "text": "React course updated as soon as there is"
  },
  {
    "start": 950.36,
    "end": 952.22,
    "text": "something to be updated and added"
  },
  {
    "start": 952.22,
    "end": 955.94,
    "text": "and that I will try my very best to give all"
  },
  {
    "start": 955.94,
    "end": 958.04,
    "text": "my students the best possible learning"
  },
  {
    "start": 958.04,
    "end": 959.58,
    "text": "experience in that course."
  }
]