Visualforce - Beyond Basics Series 25 - action region for multiple forms

What is action region ?

It is the boundary of components in the page which is marked for server processing. At beginning it may not be clear. Let me explain.
When you send a ajax call to server(via a action function), it performs following 4 step process in nutshell

1.   All the params inside the form tag, sent in  Post Call to server & assign to Controller params & basic validation happens.
2.   The action function gets executed
3.   The Page gets rerendered with new Controller values in server side (this will happen always).
4.   The rerendered page will be sent to browser. Then, browser will update only the portion of the page matching rerendered Id's (if no rerendered id's, then entire page will  be updated)

When to use ?

When the page is too big will so many input elements, the page will get really slow. If you diagnose the issue, the time will taken more in step 1 above.
So, you need to use actionregion to improve the performance.

Why it is useful ?

When you mark a region as actionregion, then only that region gets processed in server side, i.e step 1. Let's consider an example, you have a very huge page with 100 input fields. Then, you have a button which will call a action function to check just one input field is empty or  not. Do you think, for this call, server need to all 99 fields all over again. Its of no use, so, simply waste of time.
Solution - The solution is to just wrap that single Input element & button inside a actionregion, so that it will avoid rendering other elements & you get the response back very quickly.

Where is the code ?

I have illustrated this with a small example where you show one field inside actionregion & one outside it. Then, when you click the button, one gets validation message & other one gets ignored (as it is outside region)