Being Productive with the new Sencha Fiddle

Mitchell SimoensSenior Software Engineer, Sencha

mitch@sencha.com@LikelyMitch

Brief History

The Old “Fiddle” SitesGood for what they do, not great for Sencha.Aim to be library/framework agnostic code snippets.

• No Sencha knowledge.- No updated framework catalog.

- No understanding of Cmd packages.

- Little to no access to our CDN.

• Only one CSS, one JavaScript, and one HTML snippet.

• No mock data functionality.

• No searching!

What We Were Doing

• Bugs checked into git.- Was very slow, took a while to get merged.

- Polluted PR list, Ext JS PRs would be hard to find.

• Didn’t have a way to share executable code.- Provide snippets only.

- If an example existed, could point to that.

- Use them other sites but be limited.

4

What We Needed

• Means of sharing the code- In the forum, portal, docs, etc.

- Internal and public.

• Reproduce bugs- Save a test case with a framework version.

• A web app, maybe using Ext JS!- Not checked into our private git repo.

5

Fiddle 1

Fiddle 1 (July 2013)

• Savable/Forkable

• Searchable

• Support Latest Frameworks

• Mimic local development- Yes and no

• ~ 55,000 fiddles- ~7,000 distinct users

- > 130,000 files

- > 17,000 data files

Fiddle 1 Issues

• The way it runs code with multiple files- Concatenated into a single <script>

- Requiring classes may break the example

• Data requests are hidden- All client side, no network requests

• Tools are not functioning anymore- Was never updated due to Sencha Inspector

• Funky UI

8

Fiddle 2

Fiddle 2Fiddle 2 mimics local development. Code runs the way it should.

Fiddle 2

• Files load individually and remotely!- Much more like local development

• Data requests are real network requests!- Inspectable in browser dev tools

• Ext JS packages! *

• Sencha Inspector integration

• Better UI

• * being populated

Next Week!

Demo