Moving ViewState and Other Hidden Variables to the Bottom of the Page - Update
Earlier I wrote about a method of moving the ViewState to the bottom of the page. The advantages of this are two fold, one is it helps with search engine optimization by getting non-essential content out of the top of the page. Second since it is at the bottom of the page it helps the important content to render just a little bit faster.
I have an update to my render method that uses regular expressions to extract the hidden variables and move them to the bottom of the page.
Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)
ExRender(writer)
End Sub
Private Sub ExRender(ByVal writer As System.Web.UI.HtmlTextWriter)
Dim stringWriter As New System.IO.StringWriter
Dim htmlWriter As New HtmlTextWriter(stringWriter)
MyBase.Render(htmlWriter)
Dim html As String = stringWriter.ToString()
Dim mc As MatchCollection = Regex.Matches(html, "<[a-z:_][-a-z0-9._:]+((\s+[^>]+)*|/s*)/?>")
Dim sViewState As String = String.Empty
Dim sEventTarget As String = String.Empty
Dim sEventAurgument As String = String.Empty
Dim sBody As String = String.Empty
For Each m As Match In mc
If m.Value.Contains("__VIEWSTATE") Then
sViewState = m.Value
html = html.Replace(sViewState, String.Empty)
ElseIf m.Value.Contains("__EVENTTARGET") Then
sEventTarget = m.Value
html = html.Replace(sEventTarget, String.Empty)
ElseIf m.Value.Contains("__EVENTARGUMENT") Then
sEventAurgument = m.Value
html = html.Replace(sEventAurgument, String.Empty)
End If
Next
html = html.Replace("</form>", String.Empty) _
& sViewState & sEventTarget & sEventAurgument & "</form>" '& sBody
writer.Write(html)
End Sub
I extracted the method out of the event handler, just so I could do a little better long term code maintenance. I am moving three hidden input variables to the bottom of the page, but will probably just change this to move every hidden input beofre too long.
A little explanation about what is going on. If you are not familiar with Regular Expressions, I can not encourage the learning of the Regex object enough, it is magical. I will not cover the actual expression, but note that the RegEx.Matches method returns a MatchCollection containing all the strings that match the given regular pattern.
I then iterate through the returned MatchCollection to get each match. If the Value, or matched string, contains the id I am looking for, then I set the value to a string I defined to hold the tag. Then I replace the string of text with an empty string to get it out of the HTML. When I am done looping through the list of matches I then strip the Form close tag (</Form>) from the HTML and place my hidden variables, then append the form close tag back.
This example targets three specific hidden inputs, but I think I will finally settle on a solution that grabs all hidden input tags and moves them to the bottom of the form. I am just taking steps as I can. I actually will be discussing ViewState Optimization techniques in the coming days, so stay tuned.