4 ms·

I have looked the implementation* of Ext.fly and I still don't understand why it's smart or faster than using document.getElementById. Somebody care to explain?

• deleted 18y ago
  [deleted]
  • TommyM 18y ago
    Edit: Oh, I see you removed your post ;) I'll leave my reply on here anyway for people interested in what the Ext.select element does. Actually you can't use CSS selectors with the Ext.fly method. I think you are confused with the Ext.select method, which returns a CompositeElementLite instance containing an array of all elements conforming to the specified CSS selector. It lets you perform operations on a collection of elements as if you are using a single element. This is very close to what the jQuery $('.some-selector') provides you and works by iterating over the elements array and swapping the DOMElement pointer on an internal Flyweight instance right before it executes the operation on that Flyweight, and thus performing the operation on each element.
    • deleted 18y ago
      [deleted]
• TommyM 18y ago
  Ext.fly uses the Flyweight pattern, which basically means that instead of creating a new instance of Ext.Element to wrap around the DOM element, it uses one global instance of Ext.Element and just simple replaces the internal pointer to the DOM element within that instance. This makes it faster because it can skip constructor and additional logic to create the Ext.Element instance, and smart because it doesnt need additional memory for a new instance. To read more about the Flyweight pattern, you can read here: http://en.wikipedia.org/wiki/Flyweight_pattern http://en.wikipedia.org/wiki/Flyweight_pattern
• DougBTX 18y ago
  > or faster than using document.getElementById The bit to explain is that Ext.fly (and jQuery() for that matter) don't return actual DOM elements like document.getElementById does. Instead they return a Javascript object which you can use to interact with the DOM element(s) using a different API. Both are probably slower than document.getElementById, but allow you to program at a higher level of abstraction. For example, jQuery(".foo").someMethod() could act on many DOM elements, but document.getElementById().someMethod() can only act on one.