build-your-own-react

function createElement(type, props, ...children) {

children: children.map(child =>

typeof child === "object"

: createTextElement(child)

function createTextElement(text) {

function createDom(fiber) {

fiber.type == "TEXT_ELEMENT"

? document.createTextNode("")

: document.createElement(fiber.type)

updateDom(dom, {}, fiber.props)

const isEvent = key => key.startsWith("on")

const isProperty = key =>

key !== "children" && !isEvent(key)

const isNew = (prev, next) => key =>

const isGone = (prev, next) => key => !(key in next)

function updateDom(dom, prevProps, nextProps) {

isNew(prevProps, nextProps)(key)

.filter(isGone(prevProps, nextProps))

.filter(isNew(prevProps, nextProps))

dom[name] = nextProps[name]

.filter(isNew(prevProps, nextProps))

deletions.forEach(commitWork)

commitWork(wipRoot.child)

function commitWork(fiber) {

const domParent = fiber.parent.dom

fiber.effectTag === "PLACEMENT" &&

domParent.appendChild(fiber.dom)

fiber.effectTag === "UPDATE" &&

} else if (fiber.effectTag === "DELETION") {

domParent.removeChild(fiber.dom)

commitWork(fiber.sibling)

function render(element, container) {

let nextUnitOfWork = null

function workLoop(deadline) {

while (nextUnitOfWork && !shouldYield) {

nextUnitOfWork = performUnitOfWork(

shouldYield = deadline.timeRemaining() < 1

if (!nextUnitOfWork && wipRoot) {

requestIdleCallback(workLoop)

requestIdleCallback(workLoop)

function performUnitOfWork(fiber) {

fiber.dom = createDom(fiber)

const elements = fiber.props.children

reconcileChildren(fiber, elements)

nextFiber = nextFiber.parent

function reconcileChildren(wipFiber, elements) {

wipFiber.alternate && wipFiber.alternate.child

index < elements.length ||

const element = elements[index]

element.type == oldFiber.type

if (element && !sameType) {

if (oldFiber && !sameType) {

oldFiber.effectTag = "DELETION"

oldFiber = oldFiber.sibling

wipFiber.child = newFiber

prevSibling.sibling = newFiber

return <h1>Hi {props.name}h1>

const element = <App name="foo" />

const container = document.getElementById("root")

Didact.render(element, container)

108 comments

  1. Hi i am kavin, its my first occasion to commenting anywhere,
    when i read this paragraph i thought i could also make comment due to this sensible paragraph.

  2. I am now not certain where you’re getting your info, however
    great topic. I needs to spend a while finding out much more or figuring out more.
    Thanks for wonderful info I was on the lookout for this information for my mission.

  3. I like what you guys are up also. Such clever work and reporting!
    Carry on the excellent works guys I’ve incorporated you guys to my
    blogroll. I think it will improve the value of my website :).

    Feel free to visit my web page; pansionat.com.ru

  4. My husband and i have been so relieved that Louis could conclude his
    homework through the precious recommendations he discovered when using
    the blog. It’s not at all simplistic to just always be giving for free techniques that many some others might have been selling.

    We really remember we have got the website owner to appreciate for
    that. Those explanations you made, the simple website menu, the friendships you will aid to instill – it is everything powerful, and it is leading
    our son and the family reckon that that issue
    is enjoyable, and that’s rather mandatory. Thanks for all!

    my webpage :: https://mpc-install.com/punbb-1.4.6/viewtopic.php?id=375773

  5. What i do not realize is in reality how you’re now not really much more smartly-appreciated
    than you may be now. You’re so intelligent. You already know therefore considerably on the subject of
    this matter, produced me personally believe it
    from a lot of numerous angles. Its like men and women aren’t fascinated unless it’s something to accomplish with Girl gaga!
    Your own stuffs nice. All the time maintain it up!

    Here is my homepage Tamera

  6. hello there and thank you for your info – I’ve certainly picked up anything new from right here.

    I did however expertise a few technical issues using
    this site, as I experienced to reload the web site a lot of times previous to
    I could get it to load correctly. I had been wondering if your web host is OK?
    Not that I’m complaining, but sluggish loading instances times will very frequently affect
    your placement in google and can damage your high quality score if ads and marketing with Adwords.
    Well I am adding this RSS to my e-mail and can look out for much more of your respective interesting content.
    Make sure you update this again very soon..

    Here is my web blog – http://www.lubertsi.net/modules.php?name=Your_Account&op=userinfo&username=McdadeQuinton

  7. Hi! Do you know if they make any plugins to safeguard against hackers?
    I’m kinda paranoid about losing everything I’ve worked
    hard on. Any suggestions?

  8. A fascinating discussion is worth comment. I do think that you need to publish more about this topic, it may
    not be a taboo matter but generally folks don’t talk about
    these subjects. To the next! Many thanks!!

    Here is my web site … rollex11 download

  9. Hi, I think your site might be having browser compatibility issues.
    When I look at your blog in Opera, it looks fine but when opening
    in Internet Explorer, it has some overlapping.
    I just wanted to give you a quick heads up! Other then that, amazing blog!

    Also visit my website :: sky777 vip (Matthias)

  10. naturally like your web-site but you need to check the spelling on quite a few of your posts.
    A number of them are rife with spelling problems and I to find it very bothersome to
    inform the reality then again I will definitely come again again.

    My blog post – kebe.top

  11. Do you mind if I quote a few of your posts as long as I provide credit and
    sources back to your webpage? My website is
    in the very same niche as yours and my users would definitely benefit from some of the information you present here.
    Please let me know if this ok with you. Thanks a lot!

  12. I’m really impressed with your writing skills and
    also with the layout on your weblog. Is this a paid theme or did you customize it yourself?

    Either way keep up the nice quality writing, it’s rare to see a nice blog like
    this one nowadays.

    Visit my web site :: Mia

  13. I’ll immediately snatch your rss feed as I can not to find your email
    subscription hyperlink or newsletter service. Do you have any?
    Kindly allow me realize in order that I could subscribe.

    Thanks.

    My web-site :: demo sky777

  14. After I initially left a comment I appear to have clicked on the -Notify
    me when new comments are added- checkbox and from now on whenever a comment is added I recieve four emails with the exact same comment.

    Is there a way you are able to remove me from that service?
    Many thanks!

    my web page … gem epicwin

  15. of course like your web site but you have to check the spelling on several of your posts.
    A number of them are rife with spelling issues and I in finding it very
    troublesome to inform the reality then again I will certainly come again again.

    my web site http://www.lgbt.gr

  16. An outstanding share! I have just forwarded this
    onto a colleague who had been doing a little homework on this.
    And he in fact ordered me dinner due to the fact
    that I found it for him… lol. So allow me to reword this….
    Thanks for the meal!! But yeah, thanks for spending the time to talk about this
    topic here on your blog.

    Also visit my webpage: http://www.qijiang520.com

  17. Good day very nice website!! Guy .. Excellent .. Wonderful
    .. I’ll bookmark your blog and take the feeds also?
    I’m happy to search out a lot of helpful information here within the publish, we’d like develop extra
    techniques on this regard, thanks for sharing.
    . . . . .

  18. Its like you read my mind! You seem to know so much about
    this, like you wrote the book in it or something. I think that you can do with a
    few pics to drive the message home a bit, but instead of that, this is fantastic blog.
    An excellent read. I’ll certainly be back.

    my web site :: kebe.top

  19. I had been honored to receive a call from a friend as soon as he uncovered the important ideas shared on your site.
    Reading through your blog posting is a real excellent
    experience. Many thanks for thinking about readers at all like me, and I would like for you the best of success
    as being a professional in this field.

    Also visit my page: mpc-install.com

  20. Greetings! Quick question that’s entirely off
    topic. Do you know how to make your site mobile friendly?
    My website looks weird when browsing from my iphone4.
    I’m trying to find a theme or plugin that might be able
    to resolve this issue. If you have any suggestions, please share.
    Thanks!

    Feel free to visit my website; https://mpc-install.com/

  21. You really make it seem so easy with your presentation but I find this matter to
    be really something that I think I would never
    understand. It seems too complex and extremely broad
    for me. I’m looking forward for your next post, I’ll try to get the hang
    of it!

    Here is my web blog: craksracing.com

  22. I think this is among the most significant information for me.
    And i am glad reading your article. But want to remark on some general things, The
    web site style is wonderful, the articles is really excellent : D.
    Good job, cheers

    Also visit my web site … http://demos.gamer-templates.de/specialtemps/clansphere20114Sdemo01/index.php?mod=users&action=view&id=4463583

  23. Thanks, I’ve just been looking for information about this
    subject for a long time and yours is the greatest I’ve came upon till now.

    However, what in regards to the bottom line?
    Are you positive concerning the supply?

    My web blog; Premium Shot Keto

  24. I am really loving the theme/design of your weblog. Do you ever run into any web browser compatibility
    problems? A handful of my blog audience have complained about my website not operating correctly
    in Explorer but looks great in Opera. Do you have any
    suggestions to help fix this problem?

    Feel free to surf to my site … Burton

  25. Hello friends, fastidious piece of writing and good arguments commented here, I am genuinely enjoying by these.

    Also visit my webpage: Jenni

  26. hi!,I love your writing so much! share we be in contact more
    about your post on AOL? I need an expert in this space
    to solve my problem. May be that is you!
    Having a look forward to see you.

    Review my webpage; ViagRx Pills

  27. Hello! This is kind of off topic but I need some guidance from an established blog.
    Is it very hard to set up your own blog? I’m not very techincal but I can figure things
    out pretty quick. I’m thinking about making my own but I’m not sure where
    to begin. Do you have any points or suggestions?

    Appreciate it

    My blog post … http://marchegabonais.com/index.php/blog/137034/sony-dcr-dvd650-dvd-handycam-camcorder-review/

  28. Its like you read my mind! You appear to know so much about this, like you wrote
    the book in it or something. I think that you can do with a few pics to drive the message home a little bit, but other than that, this is great blog.
    An excellent read. I will certainly be back.

    Feel free to visit my site: marketing online

  29. Thanks for the sensible critique. Me & my neighbor were just preparing to do a little research about this.
    We got a grab a book from our local library but I think I learned more clear from this post.

    I am very glad to see such fantastic information being shared freely out
    there.

    Feel free to visit my blog; Liam

  30. Hello, Neat post. There’s an issue with your website in internet explorer, might test this?
    IE still is the market chief and a large element of people will
    pass over your great writing because of this problem.

    Also visit my blog post; children smoking

Leave a Reply

Your email address will not be published.