Tanggal :September 27, 2020

React Versi 17 Rilis, Wajib Menyesuaikan Dengan Versi Terbaru ini !

Spread the love

Developer React js resmi merilis Versi React Terbarunya, versi yang di update dari laman reactjs.org adalah versi 17.0, sejak 2 tahun dari versi sebelumnya, ini merupakan waktu yang cukup lama yang dikatakan oleh developer reactjs. jadi apa saja yang terbaru dari reactjs v.17.0 ini ?

No New Features (Tidak ada Fitur Baru)

Yah , lama lama nunggu 2 tahunan gak ada fitur baru, selama ini developernya ngerjain apa sih ?

nah penjelasan developer tentang mengapa update versi kali ini tidak menambahkan fitur baru bagi pengguna, karena mereka fokus untuk peningkatan fitur fitur yang telah ada. sebenarnya mereka sedang mengerjakan fitur baru, namun bukan untuk versi kali ini, versi ini difokuskan untuk developer tidak ketinggalan react js yang lama dengan react js yang akan update mendatang. ini katanya strategi hmmmm, nanti dibawah akan lebih jelas strategi apa yang dilakukan developer react js.

Gradual Upgrades (Peningkatan Bertahap)

React 17 memungkinkan peningkatan React secara bertahap. Ketika Anda meng-upgrade dari React 15 ke 16 (atau, segera, dari React 16 ke 17), Anda biasanya akan meng-upgrade seluruh aplikasi Anda sekaligus. Ini bekerja dengan baik untuk banyak aplikasi. Tapi bisa jadi semakin menantang jika basis kode ditulis lebih dari beberapa tahun yang lalu dan tidak dipelihara secara aktif. Dan sementara itu mungkin untuk menggunakan dua versi React pada halaman, sampai React 17 ini telah rapuh dan menyebabkan masalah dengan peristiwa.

Developer sedang memperbaiki banyak masalah tersebut dengan React 17. Ini berarti bahwa ketika React 18 dan versi masa depan berikutnya keluar, Anda sekarang akan memiliki lebih banyak pilihan. Opsi pertama akan meningkatkan seluruh aplikasi Anda sekaligus, seperti yang mungkin Anda lakukan sebelumnya. Tapi Anda juga akan memiliki pilihan untuk meng-upgrade sepotong aplikasi Anda demi sepotong. Misalnya, Anda mungkin memutuskan untuk memigrasi sebagian besar aplikasi Anda ke React 18, tetapi menyimpan beberapa dialog yang dimuat malas atau subroute pada React 17.

Ini tidak berarti Anda harus melakukan upgrade bertahap. Untuk sebagian besar aplikasi, upgrade sekaligus masih merupakan solusi terbaik. Memuat dua versi React — bahkan jika salah satunya dimuat dengan malas sesuai permintaan — masih belum ideal. Namun, untuk aplikasi yang lebih besar yang tidak dipelihara secara aktif, opsi ini mungkin masuk akal untuk dipertimbangkan, dan React 17 memungkinkan aplikasi tersebut untuk tidak tertinggal.

Untuk mengaktifkan pembaruan secara bertahap, Developer perlu membuat beberapa perubahan pada sistem peristiwa React. React 17 adalah rilis utama karena perubahan ini berpotensi melanggar. Dalam prakteknya, kita hanya harus mengubah kurang dari dua puluh komponen dari 100000 + jadi Developerberharap bahwa sebagian besar aplikasi dapat meng-upgrade ke React 17 tanpa terlalu banyak kesulitan. Beritahu Developer jika Anda mengalami masalah.

Demo of Gradual Upgrades (Demo untuk Update Peningkatan Bertahap)

Untuk melihat dokumentasi update terbaru. react js menyediakan repository contoh demonstrasi  disini.

Banyak peningkatan peningkatan fitur yang diupdate kali ini seperti :

  1. Changes to Event Delegation
  2. No Event Pooling
  3. Effect Cleanup Timing
  4. Consistent Errors for Returning Undefined
  5. Native Component Stacks
  6. Removing Private Exports

Untuk lebih spesificnya bisa di cek dibawah ini :

React

React DOM

  • Delegate events to roots instead of document. (@trueadm in #18195 and others)
  • Clean up all effects before running any next effects. (@bvaughn in #17947)
  • Run useEffect cleanup functions asynchronously. (@bvaughn in #17925)
  • Use browser focusin and focusout for onFocus and onBlur. (@trueadm in #19186)
  • Make all Capture events use the browser capture phase. (@trueadm in #19221)
  • Don’t emulate bubbling of the onScroll event. (@gaearon in #19464)
  • Throw if forwardRef or memo component returns undefined. (@gaearon in #19550)
  • Remove event pooling. (@trueadm in #18969)
  • Stop exposing internals that won’t be needed by React Native Web. (@necolas in #18483)
  • Disable console in the second render pass of DEV mode double render. (@sebmarkbage in #18547)
  • Deprecate the undocumented and misleading ReactTestUtils.SimulateNative API. (@gaearon in #13407)
  • Rename private field names used in the internals. (@gaearon in #18377)
  • Don’t call User Timing API in development. (@gaearon in #18417)
  • Disable console during the repeated render in Strict Mode. (@sebmarkbage in #18547)
  • In Strict Mode, double-render components without Hooks too. (@eps1lon in #18430)
  • Allow calling ReactDOM.flushSync during lifecycle methods (but warn). (@sebmarkbage in #18759)
  • Add the code property to the keyboard event objects. (@bl00mber in #18287)
  • Add the disableRemotePlayback property for video elements. (@tombrowndev in #18619)
  • Add the enterKeyHint property for input elements. (@eps1lon in #18634)
  • Warn when no value is provided to <Context.Provider>. (@charlie1404 in #19054)
  • Warn when memo or forwardRef components return undefined. (@bvaughn in #19550)
  • Improve the error message for invalid updates. (@JoviDeCroock in #18316)
  • Exclude forwardRef and memo from stack frames. (@sebmarkbage in #18559)
  • Improve the error message when switching between controlled and uncontrolled inputs. (@vcarl in #17070)
  • Fix setState hanging in development inside a closed iframe. (@gaearon in #19220)
  • Fix rendering bailout for lazy components with defaultProps. (@jddxf in #18539)
  • Fix a false positive warning when dangerouslySetInnerHTML is undefined. (@eps1lon in #18676)
  • Fix Test Utils with non-standard require implementation. (@just-boris in #18632)
  • Fix onBeforeInput reporting an incorrect event.type. (@eps1lon in #19561)
  • Use delegation for onSubmit and onReset events. (@gaearon in #19333)
  • Improve memory usage. (@trueadm in #18970)

React DOM Server

  • Make useCallback behavior consistent with useMemo for the server renderer. (@alexmckenley in #18783)
  • Fix state leaking when a function component throws. (@pmaccart in #19212)

React Test Renderer

Concurrent Mode (Experimental)

  • Revamp the priority batching heuristics. (@acdlite in #18796)
  • Add the unstable_ prefix before the experimental APIs. (@acdlite in #18825)
  • Remove unstable_discreteUpdates and unstable_flushDiscreteUpdates. (@trueadm in #18825)
  • Disable <div hidden /> prerendering in favor of a different future API. (@acdlite in #18917)
  • Add an experimental unstable_useOpaqueIdentifier Hook. (@lunaruan in #17322)
  • Using act in the test renderer no longer flushes Suspense fallbacks. (@acdlite in #18596)
  • Clear the existing root content before mounting. (@bvaughn in #18730)
  • Fix a bug with error boundaries. (@acdlite in #18265)
  • Fix a bug causing dropped updates in a suspended tree. (@acdlite in #18384 and #18457)
  • Fix a bug causing dropped render phase updates. (@acdlite in #18537)
  • Fix a bug in SuspenseList. (@sebmarkbage in #18412)
  • Fix a bug causing Suspense fallback to show too early. (@acdlite in #18411)
  • Fix a bug with class components inside SuspenseList. (@sebmarkbage in #18448)
  • Fix a bug with inputs that may cause updates to be dropped. (@jddxf in #18515 and @acdlite in #18535)
  • Fix a bug causing Suspense fallback to get stuck. (@acdlite in #18663)
  • Don’t cut off the tail of a SuspenseList if hydrating. (@sebmarkbage in #18854)
  • Fix a bug in useMutableSource that may happen when getSnapshot changes. (@bvaughn in #18297)
  • Fix a tearing bug in useMutableSource. (@bvaughn in #18912)
  • Warn if calling setState outside of render but before commit. (@sebmarkbage in #18838)

Adapun cara terbaru untuk menginstall reactjs v.17 ini :

npm install [email protected] [email protected]

atau dengan

yarn add [email protected] [email protected]

Share

Leave a Reply

Your email address will not be published. Required fields are marked *