มีอะไรใหม่ใน React 16.9.0

มาดูกันว่า React เวอร์ชันนี้ มีอะไรน่าสนใจบ้าง 🙂

.
1. กำลังจะยกเลิกคำสั่ง javascript: ที่เราใส่ใน href ของ tag <a></a> ครับ เพราะอาจเสี่ยงต่อการถูกโจมตีและความปลอดภัย (cross-site scripting) หากใครอัปเดตเวอร์ชันนี้จะมี warning ออกมาครับ อนาคตจะเอาออกแล้ว แน่นอนจะมี error แสดงเลย หากใครต้องการใช้อยู่ก็แนะนำให้ใช้ dangerouslySetInnerHTML แทนนะ

ดูเพิ่มเติมได้ที่ => http://bit.ly/2N0pJsc

.
2. ในอนาคต (เวอร์ชัน 17) จะมีการนำ lifecycle methods ออกไปทั้งหมด 3 methods ได้แก่ componentWillMount, componentWillReceiveProps, componentWillUpdate แล้วนะครับ

ถ้าในเวอร์ชันนี้ (16.9.0) ก็ยังใช้ได้แต่จะมีการแจ้งเตือนออกมา (warning) เค้าแนะนำให้เราเติมคำว่า UNSAFE_ เข้าไปด้านหน้าชื่อ methods ครับหากใครยังใช้อยู่

แต่ถ้าโปรเจคใหญ่จะมานั่งแก้เองคงไม่ไหว ก็แนะนำให้ติดตั้ง “codemod” ได้เลยครับ ด้วยคำสั่ง

npx react-codemod rename-unsafe-lifecycles

เดี๋ยวมันจัดการ rename ให้เราเอง

.
3. สามารถใช้ Profiler API สำหรับวัดประสิทธิภาพของ Web App ด้วยการเขียนโค้ดได้แล้วนะครับ (ปกติจะใช้ React DevTools) โดยต้องระบุ id และเขียน callback ที่ onRender เพื่อรับข้อมูลด้านประสิทธิภาพต่างๆ ได้

ดูเพิ่มเติมได้ที่ => http://bit.ly/2H5hzuV

.
4. ทำให้ฟังก์ชัน ReactTestUtils.act() สามารถใช้งานแบบ Asynchronous ได้ สำหรับใครที่เขียน test อยู่ก็ลองดูได้ครับ

.
อื่นๆ ลองตามไปอ่านได้ที่ blog ได้เลย => http://bit.ly/31yHnHB

.
จริงๆ แล้วใน React เวอร์ชัน 16 นี้มี features เพิ่มเข้ามาหลายอย่างครับ ไม่ว่าจะเป็น Hooks, context API, การทำ lazy loading ด้วย Suspense เป็นต้น ใครยังไม่ได้ลอง แนะนำให้ลองเอามาใช้ดูครับ

.
สุดท้ายใครอยากอัปเดตก็ง่ายๆ ครับ ลุยได้เลย

npm install –save react@^16.9.0 react-dom@^16.9.0

หรือ

yarn add react@^16.9.0 react-dom@^16.9.0

.
ลองดูนะครับ
โค้ชเอก

โค้ชเอก

โค้ชเอก

Coding Mentor

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *

This site uses Akismet to reduce spam. Learn how your comment data is processed.