8 Replies Latest reply on Mar 5, 2010 8:09 AM by Devika N

    Richfaces - AJAX template

    Walter White Novice

      Hi all,


      I have used richfaces to ajaxify a region on a page, but what if I have a template that 90% of my pages are using in which only one element changes?  Is there support for only sending content that differs between page requests?  The thing that typically changes are the title, and the inner content within the page which may include breadcrumbs.


      The content that is static for me are the banner, footer, and other elements that dress up the page.




      Walter

        • 1. Re: Richfaces - AJAX template
          Tim Evers Master

          I'm not sure I really understand your question but....


          the a4j:support (and pretty much all ajax tags) tag contains an attribute called rerender. The value for this attribute can be used to specify which components on the page should be updated. So, I'm guessing you could just specify the id's of the areas you want ajax to update in this attribute to give you the desired effect.


          I'm not sure if this is what you are talking about, but, I hope this puts you on the right track.

          • 2. Re: Richfaces - AJAX template
            Walter White Novice

            Tim,


            I am aware of the re-rendering; however, that only works for a single page.


            Let's say my site has 2 pages:


            /home.xhtml
            /contact.xhtml



            Both of these pages use the same exact template or decorator (same banner, footer, css, javascript).  The only difference between them is the content in the middle section and the page title.


            What I am trying to do is simply further reduce the amount of data the server has to send if the user goes from home to contact.  Since they use the same exact template, I shouldn't need to have to send the same decorator stuff again (unless the client doesn't support JavaScript), that is duplication and doesn't really add any value.


            I developed something similar 2 years back in PHP, I called it page diffs.  It worked the same way, instead of using JSF to store the client's state, I developed some similar stuff in PHP.  Since I knew where the client was coming from, I knew the page they last viewed, the template they were using, and consequently and CSS rules and JS scripts they had loaded.  Then from there, I just had to send them new JS/CSS, and most importantly the actual content.



            Walter


            • 3. Re: Richfaces - AJAX template
              Tim Evers Master

              Well, to be quite honest I don't think that it is such a big deal anymore whether or not you send the banner/footer/css/javascript on every request.


              Firat, all modern browsers will cache the javascript and css anyways. All the images will be cached. So, ultimately you are talking about saving yourself 1Kb of data at most!


              Second, bandwidth is vastly cheaper then maintaining complex or poor code.


              In order to do what you want to do it would require either some infrastructure workarounds which will open up a whole new level of bugs and then you'll need work arounds for special cases etc.


              OR you could do exactly what you want with the existing frame work by just changing your template. I really don't recommend this approach because it would mean the url your browser displays doesn't change, but it would accomplish what you want.


              So, to do this you would have something like this.


              <ui:composition>
                  <!--scripts and css load here-->
                  <!--banner goes here-->
                  <a4j:region id="content">
                      <ui:include value="#{PageController.currentPage}"/>
                  </a4j:region>
              </ui:composition>
              



              Now all you do is set the currentPage value on the PageController to whatever page is supposed be getting rendered in the content section and now you can just render that each time.


              This means none of you pages will use the template, they are just dynamically rendered on your page based on whatever you PageController says to render.



              But, like I said earlier. I would really really recommend that you just ignore the tiny amount of extra data going up and down the wire and let the browser optimise it for you.


              So, unless you are delivering to clients that are connecting on 56k dialup modems I would just leave it alone!

              • 4. Re: Richfaces - AJAX template
                Walter White Novice

                Yeah, that is true.  But it is an improvement.


                Walter

                • 5. Re: Richfaces - AJAX template
                  Francisco Jose Peredo Noguez Master

                  Walter White wrote on Dec 04, 2009 02:36:


                  Tim,

                  I am aware of the re-rendering; however, that only works for a single page.

                  Let's say my site has 2 pages:

                  /home.xhtml
                  /contact.xhtml


                  Both of these pages use the same exact template or decorator (same banner, footer, css, javascript).  The only difference between them is the content in the middle section and the page title.

                  What I am trying to do is simply further reduce the amount of data the server has to send if the user goes from home to contact.  Since they use the same exact template, I shouldn't need to have to send the same decorator stuff again (unless the client doesn't support JavaScript), that is duplication and doesn't really add any value.


                  Well, then... use... FRAMES!



                  I developed something similar 2 years back in PHP, I called it page diffs.  It worked the same way, instead of using JSF to store the client's state, I developed some similar stuff in PHP.  Since I knew where the client was coming from, I knew the page they last viewed, the template they were using, and consequently and CSS rules and JS scripts they had loaded.  Then from there, I just had to send them new JS/CSS, and most importantly the actual content.


                  Maybe I am wrong, but that sounds impossible, AFAIK you can not share data between requests in javascript... maybe you thought your pages were doing that but they weren't actually doing that...


                  Unless you use some FRAMES, some external plugin (like Flash or Gears) or Dom Storage but AFAIK only the very latest browsers support that...

                  • 6. Re: Richfaces - AJAX template
                    Walter White Novice

                    That is not exactly how I did it.


                    I stated that I stored the client state on the server, ie what information was sent to the client.  That part is trivial.  It sounded like what you were saying was the client sent the server its current state before fetching the new content.  That sounds possible, but would be less efficient since we should already have that information.


                    I used simple JavaScript to make this happen, and yes, it would not work in browsers that didn't support JavaScript.  It worked for all pages utilizing the same schema (http or https, but not redirects), I had some pages with different templates so I was able to eventually get that working with JavaScript hacks.


                    Walter

                    • 7. Re: Richfaces - AJAX template
                      Francisco Jose Peredo Noguez Master

                      Walter White wrote on Dec 04, 2009 15:19:


                      I used simple JavaScript to make this happen, and yes, it would not work in browsers that didn't support JavaScript.


                      To make what happen exactly? :-S. It seems to me that you are saying that you find a way to do something that is tipically done with FRAMEs using javascript.


                      But that would require not only Javascript support, but also support for DomStorage (or the use of an external plugin)



                      It worked for all pages utilizing the same schema (http or https, but not redirects),I had some pages with different templates so I was able to eventually get that working with JavaScript hacks.


                      So basically you found a way to emulate FRAMEs without using FRAMEs..., but again, how did you make that work if JavaScript forgets everything when you change from one page into another page...

                      • 8. Re: Richfaces - AJAX template
                        Devika N Newbie
                        hi

                        i am new seam framework, is it possible to load the xhtml page dynamically.

                        i.e i have combo box which gives list of xhtml pages i want to load the selected xhtml page in bottom
                        portion of current page.

                        And this is wat i have used it.

                        This is Combobox code:

                        rich:comboBox defaultLabel="Select the Application" suggestionValues="#{bean.listOfApplications}" width="200" id="myp" valueChangeListener="#{bean.valueChangeListener}">
                        a:support event="onselect" reRender="mypage" ajaxSingle="true"/>
                        /rich:comboBox>

                        on click of Combobox i am getting xhtml page name, But only this how do i load it on the page.

                        And here i want rerender the page
                        a:region id="mypage">
                                 <ui:include src="#{bean.filename}" value="#{bean.filename}"/>
                        /a:region>



                        pls help me

                        Thanks in advance||

                        Regards
                        Devika.N