Best Practices for Improving Visualforce Performance

Visualforce is designed to provide developers with the ability to match the functionality, behavior, and performance of standard Salesforce pages. If your users experience delays, unexpected behavior, or other issues specifically around Visualforce, consider the following optimization options:

First, determine whether Visualforce is the problem by ensuring that:
The following is a list of commonly encountered Visualforce performance issues and their possible solutions:
View State Size
The view state size of your Visualforce pages must be under 170KB. By reducing your view state size, your pages can load quicker and stall less often.
You can monitor view state performance through the View State tab in the development mode footer and take the following actions:
  • Use the transient keyword in your Apex controllers for variables that aren’t essential for maintaining state and aren’t necessary during page refreshes.
  • If you notice that a large percentage of your view state comes from objects used in controllers or controller extensions, consider refining your SOQL calls to return only data that's relevant to the Visualforce page.
  • If your view state is affected by a large component tree, try reducing the number of components your page depends on.
Load Times
Large page sizes directly affect load times. To improve Visualforce page load times:
  • Cache any data that is frequently accessed, such as icon graphics.
  • Avoid SOQL queries in your Apex controller getter methods.
  • Reduce the number of records displayed on a page by:
  • Lazy load” Apex objects to reduce request times.
  • Consider moving any JavaScript outside of the <apex:includeScript> tag and placing it in a <script> tag right before your closing <apex:page> tag. The <apex:includeScript> tag places JavaScript right before the closing <head> element; thus, Visualforce attempts to load the JavaScript before any other content on the page. However, only move JavaScript to the bottom of the page when you are sure it does not adversely affect your page. For example, JavaScript code snippets requiring document.write or event handlers do belong in the <head> element.
In all cases, Visualforce pages must be under 15 MB.
Multiple Concurrent Requests
Concurrent requests are long-running tasks that could block other pending tasks. To reduce these delays:
  • Make sure Action methods used by <apex:actionPoller>are lightweight. It’s a best practice to avoid performing DML, external service calls, and other resource-intensive operations in action methods called by an <apex:actionPoller>. Carefully consider the effect of action methods called, at repeated intervals, by an <apex:actionPoller>. Tasks are likely to be blocked when the method is used on a widely distributed, or continuously active page.
  • Increase the time interval for calling Apex from your Visualforce page. For example, when using the <apex:actionPoller> component, you could adjust the interval attribute to 30 seconds instead of 15.
  • Move non-essential logic to an asynchronous code block using Ajax.
Queries and Security
Improve your SOQL queries using the with sharing keyword when creating your Apex controllers. For more information, see improving your SOQL queries by only viewing a data set for a single user.
Preventing Field Values from Dropping Off the Page
Pages with many fields, including large text area fields, and with master-detail relationships to other entities, can sometimes fail to display all data. Data can be dropped due to limits on the size of data returned to Visualforce pages and batch limits. The page displays this warning: “You requested too many fields to display. Consider removing some to prevent field values from being dropped from the display.”
To prevent field values from being dropped from the page, remove some fields to reduce the amount of data returned. Alternatively, you can write your own controller extensions to query child records to be displayed in the related lists.
Use the immediate Attribute Carefully
Visualforce components configured, with the
immediate="true" attribute. do not bypass the normal component cycle of processing or validation steps. In this case, the values are submitted as requests. Functional problems occur when the component behavior includes more than basic navigation functionality. Use of this attribute is recommended only for processes where an immediate cancel of the action is required.
The following example shows good use of the attribute as a cancel button:
<apex:CommandLink action="{!cancelApplication}" value="Cancel" styleClass="btn" id="btnCancel" immediate="true">