Sencha folks have been working on an awesome new tool. It’s called fiddle.sencha.com:
If you’re familiar with jsfiddle.net, it’s essentially the same concept, but targeted at ExtJS and Sencha Touch, with some tasty features thrown in, i.e. performance analysis:
Even though it’s in beta, I’ve been using it for sometime now without much issue. Fiddle away!
I’ve been liking Sencha’s Architect IDE more and more as it’s been maturing over time. In my last post I wrote about making custom plugins in ExtJS 4, but how do you go about using them through Architect?
First step would be to ensure the we have the plugin code; I accomplished this by adding a JS Resource:
Next step should be easy enough; I figured adding a custom “plugins” property with a value of “[“ux.fadeinplugin”]” on a given Panel would do the trick:
…however, while this does work when tested in browser, this causes Architect’s canvas to go blank, essentially rendering it useless. Upon further research, there are known bugs surrounding this, but no fix yet.
Read on for a workaround in Architect…
On Tuesday Sencha announced “Complete” and “Complete: Team” bundles, where of particular interest to me was the Eclipse “IntelliSense” Plugin (see Sencha’s excellent video).
I tried it for myself – it’s a pretty standard Eclipse plugin install:
There’s an Eclipse tutorial for how to setup a project; it took me about 5 minutes. I got stuck in a few spots, but figured it out. I plugged in a basic Fieldset extension and look at the depth of auto-complete – it recognizes ExtJS object hierarchy in great depth:
There’s also Eclipse help covering the great range of features. Overall, I was very impressed.
I use Notepad++, but this just might sway me to use Eclipse. Although, the $995 for the cheapest bundle option, is rather stingy. I really wish Sencha would offer this as a stand-alone product.
Last I worked with Sencha SDK it was still version 1.2.3 beta. I had many difficulties with it and decided it certainly wasn’t ready, even for manual builds of my ASP.NET/ExtJS projects. Well, version 2.0.0 beta 3 has been out for a while now and I decided to give it a try.
The Good
I am now able to reference local .html files in the command line parameters. In last version I was only able to point it to an HTTP URL, which didn’t work for my Windows-authenticated websites.
The Bad
ReferenceError: Can't find variable: Ext phantomjs://webpage.evaluate():2 phantomjs://webpage.evaluate():1 C:\Program Files (x86)\SenchaSDKTools-2.0.0-beta3\compat\scripts\phantomjs-jsb.js:299
The Verdict
Sencha says it’s beta, so I would be very cautious about building any production code base with it. Even if you can get it to build, I’d run a full test pass on the resulting code.
See Previous Example First!
Takeaway from this post: Sencha SDK Tools 1.2.3 are still beta and I don’t advise using them in production. This is a follow up post to my previous examples – I spent some time the other day trying to set up a 1-click build process for ExtJS, and failed!
Custom Build File Size
First, let’s talk about the incorrect file size shown on this screenshot in my previous 2 posts:
In the “Custom Build” example, the custom-built app-all.js is shown as being 120KB in size. In reality, the file is about 400KB in size on the disk. I don’t understand why that is – compression? If that was the case, wouldn’t the 1MB ext-all.js in the “Full Framework” example be something closer to 200KB? After some Googling I couldn’t figure out how to tell if a file was compressed. Any advice here is welcome as I’m a bit lost.