la vita nella corsia di sorpasso; a tutta velocità, xpages!

68
La vita nella corsia di sorpasso Ulrich Krause, Milano, 27 Settembre 2013 A tutta velocità, XPages!

Upload: ulrich-krause

Post on 22-Nov-2014

706 views

Category:

Technology


2 download

DESCRIPTION

Using XPages out of the box lets you build good looking and well performing applications. However, as XPage applications become bigger and more complex, performance can become an issue and, if it comes to scalability and speed optimization, there are a couple of things to take into consideration. Learn how to use partial refresh and partial execution mode and how to monitor its execution using a JSF LifeCycle monitor to avoid multiple re-calculation of controls. We will show tools that can allow you to profile your code, readily available from OpenNTF, along with a demonstration of how to use them to improve the speed of your code. Still writing SSJS and encounter a significant slow down when using Script Libraries? See, how you can improve the speed of your application using JAVA instead of JS, JSON and even @formulas. Relatore per la sessione: Ulrich Krause

TRANSCRIPT

Page 1: La vita nella corsia di sorpasso; A tutta velocità, XPages!

La vita nella corsia di sorpasso

Ulrich Krause, Milano, 27 Settembre 2013

A tutta velocità, XPages!

Page 2: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

About: meAdministrator /Developer since 1993Senior Software Architect at BCC

OpenNTF ContributorOpenNTF Board of Directors

Blog http://www.eknori.de

IBM Champion 2011/2012/2013Notes Forum (http://www.atnotes.de)

Page 3: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

AgendaWhat factors affect Performance? Java vs. JavaScriptViewNavigator vs. GetNextDocumentStringbuilder vs. Concat (+)JSF Lifecycle ListenerPartial Update / Partial ExecuteVariable ResolverTools

Page 4: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Request

Page 5: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

HardwareThe hardware used has a significant influence on performance. There are 3 key elements:• CPU • Main Memory• Hard Disk

Page 6: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

HardwareMain Memory• Limit defined by the operating system• Scalability

CPU • Cores / Clock / Cache• Poor response time

Weak CPU AND Low Memory• Poor overall performance• Poor response times• Server "hangs"

Page 7: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

NetworkLatency• Time taken for data transmission between multiple

computers on a networkBandwidth• Rate of transmission of data

Greater Bandwidth + Lower Latency --------------------------------= Better Connection

Page 8: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Client & BrowserHardwareHow many data requests / responses are transmittedHow much data is transferred (size)Caching of resourcesHow much CSJS runsSize / complexity of the CSSComplexity of the site structure

Page 9: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Limiting factors on performanceBrowser / HTTP server• Network latency – distance/time to server. • Bandwidth – size of files.• Browser limits on concurrent downloads

• IE7 allows 2 downloads, IE8 allows 6

HTTP Server / App Server• HTTP Server JVM heap size & garbage collector• CPU time, competition between threads, gives slower

response times• Threads, limited to 40 by default

Page 10: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Limiting factors on performanceApp Server / Domino context• Read design elements from the NSF (XPage .class files, form

structure, etc)• Backend API calls may be expensive, especially for large

data sets.• Design elements may be network requests.

Page 11: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Limiting factors on performanceServlet / Lifecycle• Restore control tree – file system read. Control tree locking

– no concurrent access.• Rendered re-evaluated for every control for most phases

Browser/Client JavaScript/Dojo• Inline JavaScript blocks insertion of later HTML elements

into the DOM tree• Dojo does AJAX requests for .js files for dojo modules that

are not loaded

Page 12: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

General Performance Optionsnotes.ini• HTTPJVMMaxHeapSizeSet=1• HTTPJVMMaxHeapSize=256M

• Should be set to ¼ of the available RAM

Domino Administrator• HTTP server "Enable logging to" disabled• HTTP server thread count – defaults to 40

Remember, enabling the debugger affects performance• JavaEnableDebug=1• JavaDebugOptions=transport=dt_socket,server=y,suspend

=n,address=8000• JavascriptEnableDebug=1

Page 13: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Reducing Memory Utilizationxsp.persistence.mode=• Defines the persistence mode for the JSF pages

• file: All the pages are persisted on disk • fileex: All the pages are persisted on disk except the current

one, which stays in memory • <else>: All the pages stay in memory (tree mode)

Page 14: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Design OptimizationsUse Simple actions vs links or button with window.location JSReduce server phase processing

• Use partial update where possible• Use partial execute where possible• Use disableValidators & immediate event

Minimize work in rendered / visible computations

• Use variable resolver

When using Repeats & Views• Use viewEntry.getColumnValue instead of

viewEntry.getDocument.getColumn• Use Domino View data source dataCache property where

possible

Page 15: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Design OptimizationsLoad-time vs Runtime• Using loaded vs rendered• ExtLib Dynamic Content

• allows partial re-loading, so more use of load-time optimizations

Loading resources in the browser• CSS & browser JS

• extract to separate files. Minify & compress files• Images

• use correct size & format. Use CSS Image Sprites as possible

Page 16: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

JavaScript/CSS AggregationGroups many DOJO, CSS / JS files into a single file• Less requests from the browser to the server• Performance improvements on networks with high latency• Enhanced performance parsing CSS / JS• Fewer connections to the server

On the Server: xsp.properties:xsp.resources.aggregate=true

Page 17: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

JavaScript/CSS Aggregation

Page 18: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages PreLoadXPagesPreload=1New Feature in Notes / Domino 8.5.3Works on Server and ClientJava classes from the XPages runtime plug-ins loaded from a fixed list of runtime classes ( 435 in ND 8.5.3 )• com.ibm.xsp.core, common utility, JS wrapper, FSF runtime

classes

Java classes referenced in *-faces.config.xml• XPages control renderer, data sources, complex types

Page 19: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages PreLoadXPagesPreloadDB =

Server!!Db.nsf/XPage.xsp, myLocalDb.nsf

Works at the application levelThe application is loaded on the client / server startup into memory. • This happens even when the application is first opened in

the browser

Page 20: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages PreLoad (cont.)For each entry in the notes.ini variable, an XPage URL is generated and sent to the server

The application is loaded, and the HTML generated

The XPages runtime discards the HTML, but retains the application in memory

Page 21: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Scoped VariablesapplicationScope• Are visible for all users of one application. • Expires some time after the last user used an

applicationScope variable. • applicationScope variables are NOT persistent forever.

sessionScope• Is valid through the session of the current user. • A user session expires after some time of inactivity. • Uses don't have access to the sessionScope variables of

other users.

Page 22: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Scoped Variables (cont.)viewScope• Is visible for views on the current page only. • Useful for transporting a search query to a view.

requestScope• Is valid through one request of the current user. • That includes refreshing of a page.

Page 23: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Caching with Application Scope

Page 24: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

JSF Lifecycle

Page 25: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Lifecycle ListenerWhat happens in each phase of the JSF lifecycle?

Ulrich Krause: http://openntf.org/XSnippets.nsf/snippet.xsp?id=a-simple-lifecyclelistener-

Page 26: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Masterclass

http://www.openntf.org/internal/home.nsf/project.xsp?action=openDocument&name=XPages%20Masterclass

Page 27: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

When to Execute - # vs $# • Executed every time the page is rendered• Use for values that are likely to change

$• Executed when the page is first loaded• Use for values that don't change

Page 28: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

DataContextCan be thought of as global variablesValue can be computed dynamically or on page load• You can use ${javascript:@Today()} and run it once rather

than running a function each time.Can be scoped to any level that datasources can• XPage, Custom Control or Panel• Set a dataContext in a panel in a repeat control to avoid

multiple references to a NotesDocument's itemIs Referenced using EL• At no point in the references do you run SSJS• Not having to go through the SSJS parser

Page 29: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

DataContext - PitfallDo not bind data context variables dynamically.• They will be recomputed again and again, even when in

partial execution mode and if they are not in use

Page 30: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

DataContext - Pitfall

Page 31: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial Refresh / Update (Pro)Reduced control processing in the render response phase• Means less work on the server

• RenderResponse is the most intensive phase

Smaller response from server.• Means reduced network usage

Better browser experience• Rest of the page is still visible while waiting for a response• Inserting small sections into the page is much faster than

reloading a full page.

Page 32: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial Refresh / Update (Cons)Dependancy outside of the partial update area• Other areas of the control tree are not processed,so any

SSJS scripts in those other controls will not be run.• Enabling Partial Update where it was previously full update

may lead to functional problemsOnly one area may be partial updated by default• In CSJS you can schedule later partial updates of related

areas, but any concurrent requests will wait for exclusive access to the server-side control tree before processing on the server

http://www.timtripcony.com/blog.nsf/d6plinks/TTRY-84B6VP

Page 33: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial Refresh / Update (Cons)Refreshing more than one target ID in a single partial refresh event• http://www.timtripcony.com/blog.nsf/d6plinks/TTRY-84B6VP

Page 34: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial ExecutionReduced processing in the 3 data-processing phases• Means less work on the server, faster response times

Dependancy on Edit Box values outside of the exec area• Submitted values from Edit Boxes and/or other input

controls in other areas of the control tree are not processed, so any control values and document fields in those other areas will not be updated.

• Enabling Partial Exec where it was previously full execution may lead to functional problems where values are out-of date in the onclick script or in the redisplayed page.

Page 35: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial Execution (cont.)onclick Event Handler must be in the exec area• The ApplyRequestValues phase prepares for the

invokeApplication phase.• The onclick simple action or SSJS script won't occur if

outside the partial exec area

Page 36: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Partial ExecutionexecMode added in 8.5.1 (not in 8.5.0)execId slightly difficult to select in Designer• Select your button, in the Outline view, toggle open the

button, select the child Event Handler control, then set the execId property on the Event Handler.

• [Better UI proposed in Notes/Domino Next – in the Events tab]

Page 37: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

disableValidators / immediatedisableValidators• JSF life cycle through all phases (1-6)• But requests will not validate the data• Converters continue to work.• Items in documents will be updated

Immediate• JSF Lifecycle processes only phases (1, 2, 6)• No data processing• Items in documents are not updated• Onclick event handler scripts and render response

calculations are performed

Page 38: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Minimize work in rendered/ visible computationMost properties, like CSS “style” are only

computed in the RenderResponse phaseEdit Box and input “value” properties are used in Data Processing phases and RenderResponse phaseData Source properties are computed during RenderResponse • Results are cached for the next request's Data Processing

and InvokeApplication phases

Page 39: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Minimize work in rendered / visible computationThe rendered property is computed in all 5

lifecycle phasesAvoid re-computing values in every rendered property• @DbLookup, @DbColumn, getDocumentByKey• In the rendered property, save the computed boolean to a

viewScope variable

Page 40: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Using loaded vs renderedLoaded• is only computed once in the createView phase

• not re-computed in the other phases• false means the control is not created, so it can never be

rendered.• true means the control is added to the control tree.

• You can still compute rendered when loaded evaluates to true.

Compute the loaded property on conditions• where you could compute the rendered property and save it

to the view scope. It would never need to be recomputed for the rest of the interaction with this page

Page 41: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

ImagesUse correct file type depending on content• JPEG for complex and detailed images• PNG/GIF for simple images, fonts, transparencies

• Use the HTML <img> tag “width” and “height” attributes

For faster HTML layout in the browser• Size the image to size you intend to use

• Resizing using html attributes height and width will delay the rendering of your page

• Images larger than necessary will waste bandwidth

Page 42: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Image SpritesUse CSS Image Sprites• If you have multiple small images, make a single larger

image containing the smaller images• Use CSS to display only the relevant subset image at a

location in the page• For semantically significant sprites, provide an accessibility

“title” attribut (as sprites don't use the IMG “alt” attribute, but you still want to assist blind users)

• There's no specific XPages support for sprites, but they're used in the XPages OneIU themes

Page 43: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

CSS Image Sprite Sample

http://www.w3schools.com/css/tryit.asp?filename=trycss_sprites_img

Page 44: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages ToolboxXPages based Application• Runs on the Domino server or the Notes client• An NSF needs to be installed on the server/Notes client• A profiler jar file should be added to the JVM launch options

Measures CPU performance and memory allocationAvailable from OpenNTF.org• Free open source project• http://www.openntf.org/internal/home.nsf/project.xsp?

action=openDocument&name=XPages%20ToolboxExtended in 8.5.2 to support backend classes profiling

Page 45: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages Toolbox

Page 46: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XPages ToolboxGenerate a heap dump of the JVM running in the HTTP task• A button in the XPages profiler generates the heap dump• From the Domino console

• tell http xsp heapdump (triggers com.ibm.jvm.Dump.HeapDump())

• tell http xsp javadump (triggers com.ibm.jvm.Dump.JavaDump())

Analyze the heap dump using the Eclipse memory analyzer• http://www.eclipse.org/mat/• http://www.ibm.com/developerworks/java/jdk/tools/dtfj.html

Page 47: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Heapdump / Javadump Analyzer

Page 48: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

More ToolsPrint statements• In rendered/visible computations to see how often executed

• print("panel2 evaluating rendered property");• In the XPages root control events:

• before/afterPageLoad, afterRestoreView, before/afterRenderResponse.

• Custom control root events: • before/afterPageLoad.

• In the document data source events: • queryNewDocument, postSaveDocument, etc.

Task Manager and/or Process Explorer• Shows CPU usage & process memory usage as it happens

Page 49: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

More ToolsBrowser developer tools • for watching network transactions, partial updates,

response times• BROWSER: Firebug, Developer Tools• XPiNC: FirebugLite from ExtLib

Java / Javascript Debugging• Degrades performance but can inspect objectsUse the

Eclipse Java debugger.• In Domino\notes.ini add these 2 options:

• JavaEnableDebug=1• JavaDebugOptions=transport=dt_socket,server=y,suspend=n,

address=8000

Page 50: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Optimization – Step By Step

Page 51: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS Get all „Contacts“ into a NotesDocumentCollection, loop the collection and build the JSON by reading the values from items in the document

Page 52: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS

Page 53: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – UNID from ItemGet all „Contacts“ into a NotesDocumentCollection, loop the collection and build the JSON by reading the values from items in the document. Also UNID is stored in document

Page 54: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – UNID from Item

Page 55: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS - SingleItemGet all „Contacts“ into a NotesDocumentCollection, loop the collection and get the JSON from an item on the document. JSON is calculated on document save

Page 56: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS - SingleItem

Page 57: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – ViewNavigatorloop thru a view and get the JSON from a view column.

Page 58: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – ViewNavigator

Page 59: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

StringBuilder vs String.concatConcatenation of Strings is very easy in Java - all you need is a '+‘Each time you append something via '+' (String.concat()) a new String is created, the old stuff is copied, the new stuff is appended, and the old String is thrown away. The bigger the String gets the longer it takes - there is more to copy and more garbage is produced.Accordingly to Arno Unkrig the optimal strategy is to use String.concat() for 2 or 3 operands, and StringBuilder for 4 or more operands

Page 60: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

StringBuilder vs String.concatWhen to use StringBuilder over '+' (String.concat()) ?• use StringBuilder whenever you assemble a String in a loop• Keep in mind that '+' isn't always a good idea

http://kaioa.com/node/59

Page 61: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – ViewNavigator + StringBuilderloop thru a view and get the JSON from a

view column. Use a StringBuilder to concat the JSON

Page 62: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – SSJS – ViewNavigator + StringBuilder

Page 63: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – Javaloop thru a view and get the JSON from a view column. Use a StringBuilder to concat the JSON + use Java instead of SSJS

Page 64: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

XAgent – Java

Page 65: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

ThemesSingle document containing references to all your CSS resources• resource sections reference the CSS files • control section define what CSS classes are applied to

specific controlsXML based and easy To learn• creating a new theme document prefills sample content

Can extend other themes• <theme extends="webstandard">• will automatically include all the resource and control

definitions from that theme

Page 66: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

ThemesCreate your own themes from scratch. • Extending an existing theme will include extra stylesheets

and styles that you might not need. Be prepared to spend more time writing css though

Page 67: La vita nella corsia di sorpasso; A tutta velocità, XPages!

Life in the Fast Lane – Full Speed XPages!

Load Resources from ThemesGlobal Application / Configuration properties