Vlocity-Maximum View State Size Limit Error Debugging
Salesforce allows Visualforce pages to have a maximum view state size of 170KB.
Vlocity OmniScript has the same max view limits as a Visualforce. Angular OmniScripts are wrapped inside Visualforce.
Error Message: Maximum view state size limit (170KB) exceeded. Actual view state size for this page was >170 KB.
Error Description:
Upon launching an OmniScript and/or proceeding with a few steps, received the below error message:
“Maximum view state size limit (170KB) exceeded. Actual view state size for this page was >170 KB”.
Error Resolution:
All the below solutions can be carried out to reduce the view state size on the Omniscript.
1. Add a parameter to the target URL in the Vlocity action i.e. loadWithPage=false. By adding this parameter, the OmniScript will be loaded on the client-side rather than the default server-side. This will reduce addition of 5–8 KB of the load from the page.
Target URL:
/apex/vlocity_ins__OmniScriptUniversalPage?id={0}&OmniScriptType=<Enter Type>&OmniScriptSubType=<Enter SubType>&OmniScriptLang=<Enter Language>&PrefillDataRaptorBundle=&scriptMode=vertical&layout=<Enter Layout. i.e. lightning, Newport etc>&ContextId={0}&loadWithPage=false
2. Review logic in your Custom Vlocity Templates that are getting used in the OmniScript. Cut down unnecessary and unused code from the template.
3. Review the number of elements used inside the OmniScript. Try to keep the limit less than 100.
How to verify the View state limit of an OmniScript once it's below 170 KB?
Once the above changes work and view state limit reduced below 170 KB then the error message will disappear.
You can follow the below steps to find out the view state limit of any OmniScript with a limit of 170 KB. That will help you to take preventive measures to avoid hitting the max view state limit in future.
Write a visual force page code:
• Name of VF: “CheckviewState”. See below in the post for reference code.
- Enable User Setting: Advanced user setting-> Field name — Show View State in Development Mode.
Modify and hit below URL in browser:
https://<org instance> — c.visualforce.com/apex/CheckviewState?layout=<Layout Mode>&scriptMode=vertical&PrefillDataRaptorBundle=&ContextId= {0}&id={0} &OmniScriptSubType=<Enter Subtype> &OmniScriptType=<Enter Type> &OmniScriptLang=English
Sample URL:
- Error Scenario: Below page will appear. Non-error scenario, only ‘CheckviewState’ would appear.
Code for “CheckviewState.vfp”
<apex:page standardStylesheets=”false” showHeader=”false” sidebar=”false” docType=”html-5.0">
<div class=”vlocity via-slds” xmlns=”http://www.w3.org/2000/svg" xmlns:xlink=”http://www.w3.org/1999/xlink" ng-app=”Enter app name, it can be anyname”>
<vlocity_ins:BusinessProcessComponent strOmniScriptType=”<Enter OS Type>”
strOmniScriptSubType=”<Enter OS SubType>”
strOmniScriptLang=”<Enter OS Language>”
previewMode=”{!$CurrentPage.parameters.previewEmbedded}”
verticalMode=”{!$CurrentPage.parameters.verticalMode}”
strOmniScriptId=”{!$CurrentPage.parameters.designerPreviewId}”
scriptLayout=”<Enter Layout (i.e. Newport, lightning)>”
ContextId=”<Pass the context Id here>”/>
<script type=”text/javascript”>
var modules = [‘vlocity-business-process’];
var myModule = angular.module(‘<Same as app name mentioned above>’, modules);
</script>
</div>
<vlocity_ins:VFActionFunction />
</apex:page>
