In this page, you will find a comprehensive overview of differences and what to keep in mind when developing for both Smart Client and Web Client.
Development tips
What
Comment
Use application.getApplicationType() to determine which type of client your solution is running in and branch accordingly, when using functionality that is not supported in both clients.
Use style sheets and style classes as opposed to specifying styling on elements directly by setting their properties.
Besides a more consistent styling throughout your solution, it means less styling info is send to the client, thus the Web Client performance will improve.
Transparent PNG images are not supported by Internet Explorer <= 6. If you need transparent images and support for Internet Explorer <= 6, use transparent GIF's.
Use short running locks and transactions, preferably acquire and release them within the execution of the same method.
If user interaction is required to release an acquired lock of transaction and the user closes the browser/navigates away from the Web Client page without releasing the lock or transaction, the lock/transaction will remain until the Web Client session times out and is destroyed. Use autosave=false to accumulate edits without having a lock/transaction active.
Keep in mind that the user can, at any time, navigate away from your solution, by opening a bookmark, typing a new URL etc. (see previous remark)
Try to minimize the use of comboboxes/editable fields with (long) valuelists attached, especially in combination with forms in Tableview.
Use type-ahead fields for long valuelists or consider a edit popup dialog with search capabilities. For each field/combobox, the entire valuelist has to be included in the HTML source of the Web Client.
Minimize the use of dialogs, both modal and non-modal, and create a flat interface instead.
Multiple windows/dialogs, in general, is not a concept users like when using a browser. Popup blockers might block your (non-modal) dialog from showing.
Minimize the switching between forms as much as possible. For example: Add search functionality directly on the form, instead of on a separate form.
Minimal switching between forms provides a faster user experience.
When using images that do not come from the Servoy Media Library, do re-use images. For example: On a TreeView, when using the same image on multiple nodes, do not store the image for the node on each node record, but link to one shared image stored somewhere else.
This means that only one image needs to be downloaded to the Web Client, instead of multiple copies of the same image.
Always design for a minimal resolution and allow the UI to grow
This advice is also applicable for Smart Client development, but the Smart Client is more forgiving when not properly sizing elements and forms
Always place elements within the bounds of the form(part)
Not doing so will result in (unwanted) scrollbars in the Web Client. The Smart Client is more forgiving in this area
Differences:
What
Smart Client
Web Client
Comment
Automatic closing of a client that has been idle for a certain period of time
Possible with plugin/additional coding
Servoy Web Client is automatically closed when the HTTP session expires on the application server(configurable).
Commands
Fully supported
Commands are not supported, as there is no menubar in the Web Client for the user to trigger the command. Using the window plugin, it is possible to simulate the behavior of Servoy Smart Client.
Method execution after the method shows a modal dialog using the dialogs plugin or application.showformInDialog(...).
The method is halted until the modal dialog is closed.
The method continues to execute.
Web Client behavior will most likely be brought inline with the Smart Client behavior in a future version of Servoy.
autosave mode
autosave is triggered when clicking outside of an element.
Clicking outside an element will not trigger a save. An explicit save button is required. This also means that onRecordEditStop is not fired immediately
Default navigator
Slider to browse through records
Buttons to browse through records
Browsing through records in Tableviews and portals
Scrollbars
Paging
plugins.http.*
Operates client side
Operates server side
plugins.file.*
Operates client side
Operates server side
Note: some of the functionality of the file plugin is supported in the Web Client. Look here for more information
plugins.udp.*
Operates client side
Operates server side
plugin.window
Some functionality is supported in both clients and other functionality is only supported in one of the 2 clients. See the plugin's documentation here for more details
application.executeProgram(...)
Operates client side
Operates server side
application.executeProgramInBackground(...)
Operates client side
Operates server side
application.getPrinters(...)
Operates client side
Operates server side
application.getOSName(...)
Operates client side
Operates server side
application.getCurrentLookAndFeelName(...)
returns applicable value
Not applicable
application.setUIProperty(...)
Depends on the property
Depends on the property
application.updateUI(...)
The Web Client UI only gets updated after method execution and this is done automatically. Therefore, calling application.updateUI(...) will have no effect.
controller.setPreferredPrinter(...)
Operates client side
Operates server side
controller.showPrintPreview(...)
Opens a form in print Preview mode in the client.
Generates a PDF which is then streamed to the client.
form: onHide
the onHide event of a form does NOT fire when the user browses to a new URL from within the browser (not triggered by code in the solution).
Web Client behavior will most likely be brought inline with the Smart Client behavior in a future version of Servoy.
solution: onClose
the onClose event of a solution does NOT fire when the user browses to a new URL from within the browser (not triggered by code in the solution).
Web Client behavior will most likely be brought inline with the Smart Client behavior in a future version of Servoy.
Default row selection highlight in Tableviews and portals
Present
Not present
Not supported
What
Comment
Forms in Listview
TableView and RecordView are supported in Servoy Web Client. Use Tableview instead.
Interactive (plain) JavaBeans
Unless the bean is specifically designed to work in Servoy Web Client, only a snapshot JPEG image of the bean will be rendered in Web Client.
Client side integration with hardware on the client machine
Not supported in browsers
Look and Feels
Look and Feels are a Java concept. It is possible to edit the default Servoy Web Client style sheet.
application.setClipBoardString(...)
Not supported in browsers
application.getClipBoardString(...)
Not supported in browsers
application.getWindowX(...)
Not supported in browsers
application.getWindowY(...)
Not supported in browsers
application.getScreenWidth(...)
Only initial value is available
application.getScreenHeight(...)
Only initial value is available
application.setWindowLocation(...)
Not supported in browsers
application.setWindowSize(...)
Not supported in browsers
application.showFontChooser(...)
application.showColorChooser(...)
application.showI18Ndialog(...)
application.showCalendar(...)
application.setNumpadEnterAsFocusNextEnabled(...)
application.setStatusText(...): tip parameter
Browsers do not support the display a tooltip over the status bar
application.setToolbarVisible(...)
No support in browsers to interact with browser toolbars from within a page
application.playSound(...)
application.isLastPrintPreviewPrinted(...)
Printing is handled by the browser; no support in browsers to determine if a print was actually done from within a page.
form: showInMenu property
No support in browsers to interact with the browser menubar from within a page; to no window menu present in the Web Client.
form: bgRowColorCalc dataproviderName argument
The dataproviderName is not sent into the bgRowColorCalc when running in Web Client.
controller.sortDialog(...)
element: rollOverImageMedia property
element: cursor property
Web Client behavior will most likely be brought inline with Smart Client behavior in a future version of Servoy.
element: setScroll function
element: rotation property
plugins.agent.*
plugins.excelxport.*
No support in browsers to interact with the browser menubar from within a page.
plugins.textexport.*
No support in browsers to interact with the browser menubar from within a page.
plugins.spellcheck.*
Border property: titleBorder value
Objects that have a border property will render with a lineBorder instead of a titleBorder in the Web Client.
Draw tools
OVAL, ROUNDED_RECTANGLE and BORDER_PANEL will result in a normal RECTANGLE