Why does JS code render faster on website than react-native? - react-native

This is a bit of a general question, but perhaps someone can guide me in the right direction.
I'm using a JS library called Vexflow to render music notes. I uploaded some script to my website AND used the same code to build a React Native app.
When comparing both on the same device (Xiaomi A3), the code renders much faster on my website.
Any ideas why?
Cheers,
Nitzan

Related

Is there a way to turn an app into a website in React Native?

I built an application in React, is there a way that the same code will be used for a website?
I know Instagram is built on React and it also has a website, I wonder maybe you should add some link or something that it will open for me as a website?
Or maybe there is no such way and I have to build a website separately?
First off all, If you have written any code which is related to native functionality, then it can be challenging.
If you have only worked with views, images, and some of the basic functionality.
It can be done with react-native-web you can easily migrate your project to react-native-web.
If you project is created with expo they already provide react-native-web support.
Option 2: If you have some of the code you want to share and some is that you don't want to share or can't share.
You can use renderProp or customHooks pattern to reuse your logical code and seperate your view for react-native and react js apps.
If you want to reuse your views too, you can do those with primitives.
you can use styled-component primitives for that.
https://medium.com/react-native-training/sharing-code-between-react-web-and-react-native-applications-7f451af26378
You can get some idea here as well.

React Native 360/Panorama viewer

I believe there are a bunch of questions related to this, but they are all outdated.
I'm looking for a way to render a panorama/360 picture viewer in React Native. So far, all the libraries that try to use Google's VR SDK are outdated or broken, and not usable at all.
I have also tried to use a WebView (with react-360), but web views are just way too slow, doubles RAM usage, and worst of all, can't be used to render 360 pictures stored on the device.
I guess that another option would be to grab an OpenGL library and try to implement it myself, but that's probably a lot of work if there's something made already.
We've recently published the panorama viewer we are using in our apps. Hope it can help you too. #lightbase/react-native-panorama-view

React Native Dynamically load modules/plugins?

As far as I've searched it appears to be impossible to load modules (=plugins/libraries?) dynamically (I'm very new to React Native..).
What I'd like to accomplish is to let the user of the app load additional functions as she/he desires.
Example:
A user wants to add a music plugin to the app.
Intuitively, I'd long for something like dynamic library loading. The user would fetch the library, it'll be loaded into the code and can then be executed. However, in React Native it seems like there are only modules that can be loaded?
Alternatively, I'd hope that auto-updating the app would allow to add modules "on-the-fly" ( https://github.com/aerofs/react-native-auto-updater or www.npmjs.com/package/react-native-hot-load ). But I fear that this is only for JS and data content?
The ability to dynamically add functionality to the app is an essential part of the app. I have no previous experience worth mentioning in mobile app development.
Question: Is it possible to dynamically add functionality (also native in nature) to React Native apps?
If not, would there be a workaround?
EDIT: I have found the following repository on github: https://github.com/yusefnapora/react-dynamic-linking-example .
Unfortunately, without any description. I have no idea about Objective-C, but the repo name sounds promising. Anybody knows what its purpose is?

adapting javascript to titanium

in my app I have to compare two images, so I found this code.
I tried on my localhost and work fine but I have to do the same on appcelerator and I have some errors, the first is on var img = document.createElement('img');, then on getContext.
is there a way to adapt the code to titanium?
First of all, Titanium is not HTML so you cannot use DOM things as that code does. Though you can use Javascript but Titanium has its own sets of API and it is really superb and broad. Look here to know what you have got under the hood in Titanium
You have to look into many APIs to make your task done, but first you need to understand what that code is trying to do and what you want to achieve because if you understand the logic, then you can do it in Titanium as well. But please do not adapt DOM or HTML to Titanium :)

How do you enable Core Spotlight to index app content in React Native

What's the easiest way to go about indexing a React Native app so that content within the app appears in Spotlight searches?
If you're still interested in indexing your app content using React Native, I've written a plugin to do just that.
As you've figured out, there's no built-in react-native support for this. The only option for you to utilize the Core Spotlight framework capabilities is to create your own native module which will expose this functionality to your react-native code. You can also try to find someone who already wrote this module and made it open source, but I guess you've already tried that.
Since this is the only way, it is also the easiest... That said, it should be pretty easy to implement it yourself, assuming you have some experience with iOS development. If you run into problems you can post your code and I can point you in the right direction if necessary.