Frequently Asked Questions

Do I have to buy licenses for each developer?

No, Web Atoms for Xamarin Forms is licensed for use in one app, if developers are developing single app for two platforms (Droid and iOS), you only need to purchase two app licenses. License is applied to the app, not number of developers.

Do I have to rewrite entire App to enable JSX in existing Xamarin Forms App?

No, you can continue to use your own app, and you can write new pages in JSX and access JSX from your Prism or other navigation framework. AtomBridge instance can create a View from JSX which you can embed in existing page or you can push the view as Page inside any Navigation Page such as MasterDetailPage, TabbedPage etc.

How can enable JSX in my existing Xamarin.Forms app

All you need to do is add "WebAtoms.XF" NuGet package, and create an instance of AtomBridge class. And invoke method `InitAsync` and `CreateAsync` method, which will give you view created from JSX. You can host it anywhere you want.

How can I debug JavaScript?

Web Atoms for Android comes with custom built V8 engine which supports Chrome Developer Tools. It is recommended to use `@web-atoms/dev-server` node package to enable debugging. As soon as you open your JSX view from the dev-server url, Chrome Developer Tool automatically opens.

On iOS, you will need a mac machine which will open Safari Developer Tools associated with the simulator.

How to I access and view JSX component in debugger?

You can type, `bridge.root` in the console to access visual tree. And you can navigate each property. Each JSX component also gives you access to `data, viewModel`, `localViewModel` associated with the current selected element.

I wish to use some other framework such as Angular, is it possible?

Yes, it is possible, basically AtomBridge creates a Xamarin.Forms component and enables binding if you have specified in the JSX. You can use any other JavaScript library along with Web Atoms. Web Atoms uses module pattern and it does not pollute global namespace, so chances of conflict is very rare.

Do I have to host my JSX only on ?

No, Playground is only for testing, you can host your JSX anywhere. Web Atoms module loader package can be configured to load modules from any type of web server.

Will you help us setup the package distribution?

Yes sure, we will help you in creating application architecture including guidance of how to setup your web server.

What is an ideal setup looks like?

  • Private NPM repository, on windows we use ProGet.
  • A Web location redirect as initial page to determine which version of application package to fetch from NPM repository.

Do we have to use Web Atoms Packer?

It is recommended, you can use webpack for simpler configuration (you may need to disable minimizer to enable binding), but for Dynamic Dependency Injection Web Atoms Module loader offers node style package naming and can be configured to load packages from different package sources.

What is Dynamic Dependency Injection?

In Web Atoms, Dependency Injection allows you to inject dependency at runtime, just by specifying node style module address without (http/https). Because Web Atoms Module loader is configured to load modules from package sources. Unless specified each package is loaded from `node_modules` folder from the root specified in `InitAsync` method of AtomBridge.
Dynamic dependency injection reduces size of initial pay load, packer does not include modules that are referenced as text import.

How does Web Atoms reduce size of the app?

Each C# class along with its referenced classes increases the app size heavily. In case of AOT compiled, app sizes increase exponentially and loading/referencing modules dynamically are not supported on iOS, and on Android it requires additional steps.
In Web Atoms, a typical Web Atoms shell app (bootstrap point), contains only JavaScript engine and Xamarin.Forms classes which is well below 40-50mb.
All C#/Xaml once converted to JSX, always stays on server, and carefully packed app will only contain regularly used Views and can be delivered to the app as soon as app starts.
Rarely used views can be loaded on demand, reducing startup time and reducing the memory in use.

How can I enable Multi language support?

Dynamic Dependency Injection can also be used to load language resources (JavaScript files that contain different string resources per language) sitting in different language folders.

I have more questions....

We will be happy to help you, please contact us at support "at", or you can drop an issue at samples repository at