Are you a React Native developer ? This framework, initially released by Facebook in 2015, just got upgraded to its last version, and those three new features will change the way you code !
The Chrome Devtools Protocol is upgraded
The Chrome Devtools Protocol (CDP) is an API that lets applications communicate with an open Chrome instance. React Native uses it in order to debug apps in Chrome browsers, and one of its domain, the FuseboxClient, which was used to identify and register metadata about the debugging client to the Chrome DevTools backend for example, was replaced by a more modern implementation: ReactNativeApplication.
This helps removing legacy code, and better aligns with Chrome DevTools standards.
For most React Native developers, this won't change anything. But if you are using - or even creating - a custom debugging integration for React Native, you may see significant changes and would need to update your implementation for it to work.
Change the Image load event size from logical to physical
Images, like every other component in React Native, have a lot of props, and some of them were made to manage events. It's the case of onLoad which is triggered when the image is loaded successfully. It takes a callback with a parameter (of type ImageLoadEvent) that provides information about the source image.
The react native community realized that this ImageLoadEvent.source, the object containing the source image, returned two values (width and height) that were calculated as a logical size (points) rather than in pixels, which is easier to calculate.
<Image
// Source and style
onLoad={(e: ImageLoadEvent) => console.log("size: ", e.nativeEvent.width)}
/>
// Before: output size in points
>> size: 100
// Now: output size in pixels
>> size: 250
This means now it is going to be easier to manage and calculate sizes for images, may it be for transitions or responsiveness.
Adds support for the second parameter of console.table()
Most javascript and typescript developers know about the famous console.log(). They use it to debug their code by printing variables or text in the console. A few of them know about its little brother console.table(), which aims to display an easy-to-read array.
Even fewer developers know that console.table() actually supports two parameters:
- the first one is obviously the array to print
- the second one is the list of columns to display
The problem was that, until React Native v0.78.0, this second parameter used to throw an FlowExpectedError[extra-arg]. Now you can do it ! Isn't that wonderful ?
Conclusion
Once again, the community worked hard to give us exciting new features for React Native v0.78.0. May it be for the devtools, the Image component, or even the console library, they have upgraded every part of this wonderful project. What do you think about those features ? Are they exciting or useless ? Do you often use console.table ? Tell us in the comments !
Top comments (0)