Translating 520 words of Facebook React, implementation-notes.md

in #utopian-io7 years ago

Translating 520 words of Facebook React, implementation-notes.md


Source

Today I finished translating implementation-notes.md total of 520 words.

  • I start at 77%
    Capture_2017_12_24_22_48_14_649.png
  • And finish at 89%
    Capture_2017_12_26_10_35_21_944.png

You may check my activity on this link: https://crowdin.com/project/react/fil/activity

  • And here are the few Examples of my translation:

Ang reconciler ay na implementa rin ng suporta para sa setState() sa composite na mga komponent. Maramihang pag-update sa loob ng mga event handler ay ginu-grupo-grupo sa isahang pag-update. implementation-notes.md 09:34 PM
Ang logica ng pag-update ng listahan ng children ay nagmula sa isang labanan na tinatawag na ReactMultiChild na ginagamit sa implementasyon sa class ng panloob na instance sa parehont React DOM at React Native. implementation-notes.md 09:33 PM
Halimbawa, Sinabi ng React DOM sa reconciler na gumamit ng ReactDOMComponent bilang implementasyon sa panloob na intance ng host. implementation-notes.md 09:30 PM
Ang mga renderer ay gumagamit ng injection para makalusot sa panloob na class ng host sa reconciler. implementation-notes.md 09:29 PM
Kanilang ini-rerepresinta ang mga node ng text at ang "empty slots" na makukuha mo sa pag-reder ng null. implementation-notes.md 09:28 PM
Sa karagdagan sa composite at panloob na instance ng mga class sa host, mayroon din namang mga class para sa "text" at "empty" na mga komponent. implementation-notes.md 09:27 PM
Ang laki ng ka-kumplikaduhan sa aktwal na implementasyon ng React ay may kinalaman doon. implementation-notes.md 09:26 PM
Binabasa din ng reconciler ang key mula sa mga elemento, at ginagamit ito upang makapagtatag ng mga korespandeng panloob na instance na elemento sa isang aray. implementation-notes.md 09:25 PM
Ang mga komponent ay maaring mag-render ng null, at ang reconciler ay kayang mag handle ng "walang laman na mga puwang" sa mga array at na-render nang output. implementation-notes.md 09:13 PM
Ang dokumentong ito ay mas pinasimple kumpara sa tunay na codebase. Merong ilang mga importanteng aspeto na hindi namin binanggit: implementation-notes.md 08:49 PM
Ano Ang Aming Inalis implementation-notes.md 08:48 PM
Ito ay ang mga pangunahin kung paanong ang React ay gumagana sa panloob. implementation-notes.md 08:48 PM
var rootEl = document.getElementById('root'); mountTree(<App />, rootEl); // Muling paggamit sa umiiral ng DOM: mountTree(<App />, rootEl); implementation-notes.md 08:47 PM
Ngayon ay ang pagtawag ng mountTree() ng dalawang beses na may parehong uri ay hindi nakakasira: implementation-notes.md 08:46 PM
function mountTree(element, containerNode) { // Mag-tsek sa umiiral ng tree if (containerNode.firstChild) { var prevNode = containerNode.firstChild; var prevRootComponent = prevNode._internalInstance; var prevElement = prevRootComponent.currentElement; // Kung kaya namin, muling gamitin ang umiiral nang komponent ng root if (prevElement.type === element.type) { prevRootComponent.receive(element); return; } // Kung hindi, I-unmount ang umiiral ng tree unmountTree(containerNode); } // ... implementation-notes.md 08:45 PM
Ngayon na ang parehong CompositeComponent at DOMComponent ay ipinatupad ang eceive(nextElement) na metod, maaari nating baguhin ang top-level na mountTree() na punsyon para gamitin kapag ang elementong type ay kapareho ng kung ano sya dati: implementation-notes.md 08:43 PM
Mga update ng Top-Level implementation-notes.md 08:41 PM
At ito ay para sa pag-update ng mga komponent ng host. implementation-notes.md 08:41 PM
while (operationQueue.length > 0) { var operation = operationQueue.shift(); switch (operation.type) { case 'ADD': this.node.appendChild(operation.node); break; case 'REPLACE': this.node.replaceChild(operation.nextNode, operation.prevNode); break; case 'REMOVE': this.node.removeChild(operation.node); break; } } } } implementation-notes.md 08:40 PM
// I-proseso ang linya ng operasyon. implementation-notes.md 08:40 PM
At sa huling hakbang, aming isinagawa ang mga operasyon ng DOM. Muli, ang totoong code ng reconciler ay mas komplikado dahil hinahawakan din nito ang mga galaw: implementation-notes.md 08:40 PM
this.renderedChildren = nextRenderedChildren; // ... implementation-notes.md 08:36 PM
prevChild.receive(nextChildren[i]); nextRenderedChildren.push(prevChild); } // Sa wakas, maa-unmount na ang kahit anong children na di umiiral: for (var j = nextChildren.length; j < prevChildren.length; j++) { var prevChild = prevRenderedChildren[j]; var node = prevChild.node; prevChild.unmount(); // I-record na kailangan nating tanggalin ang node operationQueue.push({type: 'REMOVE', node}); } // Ituro ang listahan ng na-render na children sa na-update nang bersyon. implementation-notes.md 08:36 PM
if (!canUpdate) { var prevNode = prevChild.node; prevChild.unmount(); var nextChild = instantiateComponent(nextChildren[i]); var nextNode = nextChild.mount(); // Record that we need to swap the nodes operationQueue.push({type: 'REPLACE', prevNode, nextNode}); nextRenderedChildren.push(nextChild); continue; } // If we can update an existing internal instance, // just let it receive the next element and handle its own update. implementation-notes.md 08:29 PM
var canUpdate = prevChildren[i].type === nextChildren[i].type; // Kung hindi natin ma-update ang umiiral na instance, kailangan nating i-unmount ito // at mag-mount ng bago kesa ito. implementation-notes.md 08:29 PM



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

Hey @ruah I am @utopian-io. I have just upvoted you!

Achievements

  • Seems like you contribute quite often. AMAZING!

Suggestions

  • Contribute more often to get higher and higher rewards. I wish to see you often!
  • Work on your followers to increase the votes/rewards. I follow what humans do and my vote is mainly based on that. Good luck!

Get Noticed!

  • Did you know project owners can manually vote with their own voting power or by voting power delegated to their projects? Ask the project owner to review your contributions!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

Coin Marketplace

STEEM 0.17
TRX 0.15
JST 0.028
BTC 58387.03
ETH 2359.14
USDT 1.00
SBD 2.37