Should we have multiple apex:form in one page

The short answer to this question is: No. You should never have more than one <apex:form> tags in your Visualforce page. It will always increase your viewstate size for no good reason.

If you are still interested in understanding how it impacts, read on.

Pure Dummy Page Experiment

First experiment is a pure dummy page with a controller containing some data which the page doesn’t use. We experiment it with single apex:form and double apex:form and compare the differences.

Controller:

public with sharing class PureDummyController 
{
    public String abc {get; set;}
    public Account a {get; set;}
    public PureDummyController()
    {
    	abc = 'Hello';
    	a = [Select Id, Name From Account limit 1];
    }
}

Single Apex:Form:


<apex:page controller="PureDummyController">
    <apex:form >
    </apex:form>
</apex:page>

Double Apex:Form:

<apex:page controller="PureDummyController">
    <apex:form >
    </apex:form>
    <apex:form >
    </apex:form>
</apex:page>

Result:

Single Form:

Double Form:

Conclusion:

There is a 0.05k difference by adding an additional <apex:form>.

Please note that the difference is happened at the Internal part of view state. The apex controller side size remains the same. So it doesn’t double the controller’s memory.

The difference is small. But there is no reason for adding it.

A bit crazy experiment

Now let’s be a little bit crazy. Suppose we have two <apex:inputText> tags. And in between them we have a bunch of other apex:xxx tags which does not need to be included inside <apex:form>. In that case, is it a good practice to use two separate <apex:form> in order to have less stuff inside <apex:form>?

The answer is still no. Here is the experiment.

Controller:


public with sharing class TestMultipleApexFormController 
{
    public String firstInput {get; set;}
    public String secondInput {get; set;}
    public List<String> outputList {get; set;}
    
    public TestMultipleApexFormController() 
    {
        outputList = new List<String>();

        for(Integer i = 0; i < 100; i++) 
        {
            outputList.add('Test output ' + i);
        }
    }
}

Single form page:

<apex:page controller="TestMultipleApexFormController">
	<apex:form>
		<apex:inputText value="{!firstInput}"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:sectionHeader title="Connection" subtitle="Hello"/>
		<apex:inputText value="{!secondInput}"/>
	</apex:form>
</apex:page>

Double form page:

<apex:page controller="TestMultipleApexFormController">
	<apex:form>
		<apex:inputText value="{!firstInput}"/>
	</apex:form>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:sectionHeader title="Connection" subtitle="Hello"/>
	<apex:form>
		<apex:inputText value="{!secondInput}"/>
	</apex:form>
</apex:page>

Result:

Single Form:

Double Form:

Conclusion:

Actually, I have done much more experiments than the above two to watch the differences. In general, double <apex:form> will almost always result in a view state which is 0.04-0.05 k larger than single <apex:form>.

Moving things out of <apex:form> won’t result in huge differences in the size of view state. <apex:xxx> tags will always cost some view state size. And plain html will not cost any.

All in all, it is never a good idea to use multiple <apex:form> in one single VF page. But the difference from view state point of view, is not too bad though.

Next Post:

How does setRedirect work in Visualforce

Subscribe to Sfdcinpractice

Subscribe to get the latest blogs and tutorials of sfdcinpractice. No spam, no trash, only the awesome posts from sfdcinpractice. 

Leave a Reply

Your email address will not be published / Required fields are marked *