{"id":53,"date":"2008-08-22T21:12:38","date_gmt":"2008-08-23T01:12:38","guid":{"rendered":"http:\/\/hardlikesoftware.com\/weblog\/2008\/08\/22\/wls-console-beauty-more-than-skin-deep\/"},"modified":"2008-08-22T21:36:58","modified_gmt":"2008-08-23T01:36:58","slug":"wls-console-beauty-more-than-skin-deep","status":"publish","type":"post","link":"https:\/\/hardlikesoftware.com\/weblog\/2008\/08\/22\/wls-console-beauty-more-than-skin-deep\/","title":{"rendered":"WLS Console beauty more than skin deep"},"content":{"rendered":"<p>[This originally appeared on my dev2dev blog 10-Nov-2007]<br \/>\nBest practices lead to performance improvements in the Tech Preview WLS Admin Console.<br \/>\n<!--more--><br \/>\nThe Weblogic Server 10.3 tech preview was recently released. You can read more about it <a href=\"http:\/\/dev2dev.bea.com\/pub\/a\/2007\/11\/weblogic-server-10-tech-preview.html\" title=\"This link is broken and 10.3 has shipped\">here<\/a> including links to download it.<\/p>\n<p>I&#8217;m very pleased with my work to improve the look and performance of the Admin Console. If you have used the WLS 10.0 Console before the first thing you will notice is the new look. Things are pretty much still in the same place but the look is lighter and smoother. You will also notice a snappier response. A number of <a href=\"http:\/\/edocs.bea.com\/wls\/essex\/TechPreview\/pdf\/Console_Support.pdf\">changes<\/a> have been made to improve performance. My work was exclusively in the presentation layer. <\/p>\n<p>By following best practices for HTML and CSS the page size was reduced about 30 to 40 percent depending on the specific page. Even though additional graphics were added the over all page weight (this includes images, CSS, and JavaScript resources) was reduced around 20%. This means less HTML to generate on the server, less data transfered over the network and less to render on the browser, which adds up to faster response time.<\/p>\n<p>Here is a list of some of the best practices used:<\/p>\n<ul>\n<li>Use CSS and semantic markup for layout rather than tables. For Portal apps this means avoiding the grid layout. Console still uses tables for layout of form controls to preserve the existing look.<\/li>\n<li>Move all style to external stylesheets. Don&#8217;t hard code style in tags or JSPs. This way the dynamic page gets smaller and the stylesheets can be cached. This also makes branding by console extensions easier.<\/li>\n<li>Include JavaScript and CSS resources only once. Use the Portal dependencies facility rather than include resource references in tags or JSPs.<\/li>\n<li>Keep the junk out of pages. Keep an eye on extra whitespace in JSPs. Use JSP comments &lt;%&#8211; &#8212; %&gt; rather than HTML comments. There is no need for these to be sent to the client. Prefer JSP documents to JSP pages because they remove whitespace. Console has too many pages to convert all of them to JSP documents but key ones were converted and the new Portal look and feel uses JSP documents.\n<li>Portal themes have their use but Console didn&#8217;t need them. Removing themes eliminated a little markup but more importantly simplifies Console look and feel extensions.<\/li>\n<li>Reduce the number of round trips to the server for images by including multiple images in a single file.This  technique, called <a href=\"http:\/\/www.alistapart.com\/articles\/sprites\">CSS sprites<\/a>, was used for new images.<\/li>\n<\/ul>\n<p>The presentation layer is more than just how the app looks it can have an impact on how it performs.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[This originally appeared on my dev2dev blog 10-Nov-2007] Best practices lead to performance improvements in the Tech Preview WLS Admin Console.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[3],"tags":[],"_links":{"self":[{"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/posts\/53"}],"collection":[{"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/comments?post=53"}],"version-history":[{"count":0,"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/posts\/53\/revisions"}],"wp:attachment":[{"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/media?parent=53"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/categories?post=53"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hardlikesoftware.com\/weblog\/wp-json\/wp\/v2\/tags?post=53"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}