Converting Anvil App to Production Level

Hello!

We’re a small company that uses Anvil apps for a lot of our internal tools. Some internal tools are going to be publicly launched as a new SaaS venture, very niche. I am not a programmer by any profession, but have coded all the apps and maintain them myself currently.

I am confident I don’t know enough to actually make a publicly available app and have been going through cost analysis and best routes to make this. I can’t find any “proper” custom UI apps publically available that seem to be built on Anvil, only demos for the most part.

My logic for saving the most cost and doing the most with what I know, it to create the platform I’m looking to make in Anvil the best I can, and then having it “converted” to a Flask/python or potentially Vue frontend/backend by a freelancer to get something going.

Has anyone had experience doing the same type of deal and/or can guide me in a better direction? As we have the working models (internally being used for some time now, they are rough in visuals but very functional) we’re trying to save as much reasonable costs as possible by having a working model to “convert” rather than develop from scratch for the potential dev.

1 Like

While there are a lot of commercial demos using Anvil, there are also a number of companies who have made and are making commercial products with Anvil. If you’re curious about some of them, I would highly recommend having a listen to some of Anvil’s podcast episodes.

1 Like

You can use your apps as proof of concept for the production app whether the production app is built in flask or Anvil.

I would build it in Anvil. If you need to pay someone to do it for you, at the end you have an Anvil app and you can do most of the maintenance by yourself.

If I understand, you already have experience building Anvil apps, but your apps don’t look professional and may not be reliable enough.

Get someone to make your Anvil apps look professional, safe and reliable, either by rewriting them or improving them. Then you can keep maintaining them by yourself or keep paying someone else.

Either way using Anvil will be a time and money saver.

You may need to beef up your plan, but if you say niche, the volume is not going to be a problem.

All of this is valid if the biggest limitation with Anvil apps is not a problem for you: they are single page apps, so you will not have SEO.

1 Like

That’s a very good point in terms of SEO, something I hadn’t considered. Thank you for your reply, I’m looking into seeing how polished of a design/speed I can get with Anvil and keep it to the “app” portion solely of the website so the SEO can be managed from an external system.

1 Like

Design is all about HTML/CSS customization. Any decent web designer can create the bits you’d need for that. There are some very slick looking Anvil apps out there that use custom HTML/CSS. See this one for an example: A fully-featured ticketing system, built with Anvil

Speed is about optimizing your Anvil app. That’s definitely an art. There are some general guidelines that apply to all apps, while others depend on what your app is doing.

Some of the general guidelines:

  1. Minimize server calls - I’d say this is the most common cause of slowdowns, since every server function has a network delay built in.

In the most extreme case, I have one app where I make a single server call when the user starts it, and after that everything is done client-side, with server calls hiding in the margins while the user reads new content to keep track of what they’re doing so they can resume at the same spot later. From the user’s perspective, there’s zero delay after that initial server call.

  1. Watch for server imports that take time. Some imports can take seconds to process, and all the global imports in a server module happen every time you make a server call, even if the particular function doesn’t use that import. Moving those expensive imports into the functions that use them will eliminate the delay when you don’t need them.

  2. Cache data client side, especially if it doesn’t change often. Remember that client side module live as long as the user has the app open, so you can cache some sorts of data instead of fetching it from the server every time.

Anvil has a robust system for separating out the development, testing, and production environments now with the beta editor. It’s well suited to being used for a production system.

I do this with my app, and it works well.

2 Likes

The 3 points are all good, but I would like to make a little clarification.

This is true if you don’t have a persistent server, which is only available with the Business plan, but if you plan to do a SaaS, it may be advisable.

Still, once in a while the persisting server doesn’t persist and it’s good to know that ALL the imports can be executed at the next server call.

Maybe a part of this can be accomplished using HTTP APIs. Since my website is all about novels that can have lots of different words, I needed them to appear in Google searches. This is why I started using HTTP APIs in my app which fetches the content of the book from my data tables, parses it, and returns an HTML page having the content of the book. This enables Search Engines to index it pretty easily and start showing the words from my book in search results…

You can see my sitemap.xml on https://geekestories.anvil.app/_/theme/sitemap.xml

From there, you can paste the links in Google Search and see the results are appearing (Some of them may not be indexed yet though)

The only downside is that I had to say goodbye to the Anvil Editor while making the HTML pages. So maybe you can make a simple web page for indexing and then add a Hash URL that leads you to the Anvil Form (Like I did with my case)

4 Likes

This is an interesting approach to the SEO problem: create an http endpoint for every indexed page, add a sitemap and feed it to Google!

Have you tried with an automatic redirect that will redirect users to the app but not redirect the search engine crawlers?

2 Likes

Not yet. But I think that may be easy to implement.

1 Like

So if you are not running persistent server modules like @stefano.menci mentioned…

This makes me wonder, what if you make multiple server modules? When anvil says they load the whole module into a new virtual instance of the python interpreter every time the server is called, do they mean “every module in the app” or do they mean just the one containing the decorated function that is called?

Essentially I wonder if doing this would make a difference:
image

…and if it does, then how does it handle a ServerModule to ServerModule callable? Does it open two virtual instances of the python interpreter? Or is it smart enough to just load more into the currently running instance. (Like if I was feeding straight python code strings to a REPL )

Link to the docs if anyone is unclear what I am referencing:

Last I heard, all server modules in the app are loaded.

If you use anvil.server.call in the server, then I’m pretty sure you get a new instance of the server module loaded, because that’s what you asked for. But there’s no reason to use anvil.server.call in the server, just call the other server function like a normal Python function.

1 Like

So its just for organization and legibility then, I get it.

It’s odd that you have to break pythonic convention and put the slow imports inside the functions that use them, but its also not conventional to spin up a new python executable every time you call a single function in a script, so I guess it is pretty understandable.

For http endpoints, a second workaround is to create 2 apps, one with the http endpoints that use slow imports and one with the ones that don’t.

For normal callable functions splitting the app wouldn’t work, because all the modules of all the dependencies must be available before a call is started.

A lot of the performance advice here is in this wiki @stefano.menci initiated a few months back:

But I don’t think some ideas here are covered there yet:

p.s. Besides the podcast, another portal to info about Anvil production apps is found at the bottom of this page: Anvil | Examples