Jump to content

QmlWeb/Qml.js/Design Questions and Decisions: Difference between revisions

From KDE Community Wiki
No edit summary
No edit summary
Line 6: Line 6:
; C++ style getters and setters:
; C++ style getters and setters:
: ''this.width(); and this.setWidth(width);''
: ''this.width(); and this.setWidth(width);''
* C++ style
* ''pro/con:'' C++ style
* fast in all browsers
* ''pro:'' fast in all browsers
; Transparent getter/setter using Object.defineProperty
; Transparent getter/setter using Object.defineProperty
: ''Object.defineProperty(this, "width", { get function(){}, set: function(){} });''
: ''Object.defineProperty(this, "width", { get function(){}, set: function(){} });''
* nice while debugging
* ''pro:'' nice while debugging
* worse performance in IE
* ''con:'' worse performance in IE
* horrible performance in Firefox
* ''con:'' horrible performance in Firefox
; Transparent getter/setter using literal notation
; Transparent getter/setter using literal notation
* nice while debugging
* ''pro:'' nice while debugging
* worse performance in IE
* ''con:'' worse performance in IE
* you can't use object literals and inheritance at the same time in a standard compliant manner
* ''con:'' you can't use object literals and inheritance at the same time in a standard compliant manner




Line 29: Line 29:
; Using property objects and direct object references
; Using property objects and direct object references
; Using property indexes and a properties array
; Using property indexes and a properties array
* If done right, it might provide weak references
* ''pro:'' If done right, it might provide weak references
; Using a properties object and access it per name
; Using a properties object and access it per name
* Bad bad bad performance
* ''con:'' Bad bad bad performance
 
=== Handling bindings ===
; Let the bindings depend on each other and make them set the value on update
* ''pro:'' Seems logically like the right thing. After all it's the bindings that define the dependencies
* ''con:'' How to know when a property gets overwritten and thus the binding is invalidated?
; Let the properties depend on each other and make them reevaluate the binding when needed

Revision as of 08:55, 4 March 2015

This page intends to collect questions about software architecute and software design, pros and cons as well as the decisions made on the topic.

Runtime Architecture

Getter/Setter Technique

Possibilities:

C++ style getters and setters
this.width(); and this.setWidth(width);
  • pro/con: C++ style
  • pro: fast in all browsers
Transparent getter/setter using Object.defineProperty
Object.defineProperty(this, "width", { get function(){}, set: function(){} });
  • pro: nice while debugging
  • con: worse performance in IE
  • con: horrible performance in Firefox
Transparent getter/setter using literal notation
  • pro: nice while debugging
  • con: worse performance in IE
  • con: you can't use object literals and inheritance at the same time in a standard compliant manner


Benchmark: http://jsperf.com/getter-setter/7

Decision: Use C++ style getters and setters

Storing properties

As we're using setters and getters in either way, we need to store the actual property value separated. There're multiple possibilities for that:

Private member using closures
Private member using like _width
Using property objects and direct object references
Using property indexes and a properties array
  • pro: If done right, it might provide weak references
Using a properties object and access it per name
  • con: Bad bad bad performance

Handling bindings

Let the bindings depend on each other and make them set the value on update
  • pro: Seems logically like the right thing. After all it's the bindings that define the dependencies
  • con: How to know when a property gets overwritten and thus the binding is invalidated?
Let the properties depend on each other and make them reevaluate the binding when needed