Introducing the new, improved flash-javascript bridge!

It's been a while. We got such great response from the post about our new <html/>, I thought it was time to do it again. In 4.0, the Flash embedding and Flash/browser communications subsystem has been rewritten from the ground up. What does this mean for you? You can now reliably communicate across the Flash/browser javascript boundary, sending as much data in either direction as you need. You can use DHTML to deliver your UI, and use Flash for things it's great for, like playing audio and video. Your applications can degrade gracefully for users that don't have the Flash player installed. More importantly, Flash apps can be more tightly integrated with the HTML pages they live in than ever before. I predict a new wave of innovative mashups that take advantage of the strengths of HTML and Flash, without relying entirely on either one.

Before I say more, please take a look at this example. Go ahead and click the 'Load' button, and you should hear some audio playing. What's the big deal? All the UI elements you're interacting with are DHTML, which is communicating with a tiny laszlo SWF audio player embedded on the same page. As the audio plays in the Flash app, it sends events to update the position of the play head in the DHTML app. Clicking buttons in the DHTML app sends events to the Flash application, affecting audio playback. It's a small example, but it shows off the feature pretty well.

One thing this example doesn't show is how much data you can pass across the boundary. I just ran a test, and on my machine I was able to pass 700K into Flash in 72 ms, and get 700k of data out of Flash in 50ms. Pretty snappy, huh?

All of this works across Firefox Safari and IE, for flash 7 and up.

And, you can take advantage of the improved history feature to make your applications interact with the browser forward and back buttons - with bookmarking and deep linking to boot!

Many thanks to our friends at Dojo foundation for their stellar contributions to the community, in particular Brad Neuberg, author of the awesome dojo.flash module which is the basis of the new feature.

13 Responses to “Introducing the new, improved flash-javascript bridge!”

  1. John Dowdell Says:

    “…how much data you can pass across the boundary. I just ran a test, and on my machine I was able to pass 700K into Flash in 72 ms, and get 700k of data out of Flash in 50ms…..”

    Watch out for browser dependencies. The various browser/plugin intercommunication schemes, whether the current NPRuntime/ActiveXScripting or the older LiveConnect and other models, were specified for messaging… what they’ll do with high-volume or high-frequency messaging is up to individual browser implementation, unspecified.

    (Brad Neuberg got caught with big-data transmission when using Adobe Flash Player for local storage of JS/HTML data… in some of the current IE/Win browsers people are noticing that rapidfire messaging can drop events.)

    jd/adobe

  2. Max Says:

    @john,

    Thanks for the heads up! Indeed, I had to add a fair bit of queuing to get things working properly in all browsers. If you have any more specifics on what browser/player combinations were dropping events, it would be very helpful. Thanks!

    Regards,
    Max Carlson
    OpenLaszlo.org

  3. John Dowdell Says:

    Sorry, Max, I’m not good on specfic browser differences these days… I see the descriptions on the mailing lists, but don’t trust myself to keep the authoritative log.

    Being sure to test any implementation against the range of browser versions and OS should help ensure of an application’s success…?

    jd/adobe

  4. Max Says:

    @john,

    But of course - we do test across a wide range of browsers and OS versions. Thanks again!

    Regards,
    Max Carlson
    OpenLaszlo.org

  5. Chris Says:

    Your example doesn’t work for me.

    Gentoo Linux
    Firefox 2.0.0.2
    Flash 9.0.31

  6. Max Says:

    @Chris,

    Thanks for the heads up! I have to confess, I haven’t tested this feature thoroughly under Linux yet. But we’ll get there!

    If you run with the firebug extension, do you see any errors reported?

    Regards,
    Max Carlson
    OpenLaszlo.org

  7. Matthew Minix Says:

    Cool demo, I noticed that right clicking brought up a menu, with the option to view source. Upon clicking it, it popped up a new menu, with just another player. Am I doing something wrong or is it just not finished yet?

    In case you need it,
    OS: Windows XP Pro
    Firefox 2.0.0.3
    Flash 9,0,28,0

    On a different note, I found out about OpenLaszlo after some disillusionment with Flex, and so far I’ve been very impressed with what I’ve seen. I plan on trying it out myself on a project coming up. Keep up the good work!

  8. Adam Says:

    Running the example in Firefox 2 under Ubuntu I get these errors:

    LzModeManager is not defined
    http://www.openlaszlo.org/lps-4.0.0/lps/includes/lfc/LFCdhtml.js
    Line 2078

    dojo.flash.comm.callMethod is not a function
    http://www.openlaszlo.org/lps-4.0.0/lps/includes/embed-compressed.js
    Line 714

  9. the rasx() context » Blog Archive » OpenLaszlo, Adobe Apollo and Firefox 3 Says:

    [...] Firefox 3 with an open Eclipse plug-in and OpenLaszlo with a “new, improved flash-javascript bridge� look more attractive to me than what Adobe offers. And Firefox 3 stuff I have never seen! These two alternatives seem to be culturally incapable of distributing software that kills itself after 29 days unless you pay the ransom. Like I have 29 solid days to achieve an interoperable understanding of an Adobe product… Not this month… Not next month… Maybe later… There has to be a better way to make money. [...]

  10. <blog> interfce.com </blog> » Blog Archive » create INTEGRATED {DHTML and FLASH} rich internet applications from a single codebase! Says:

    [...] Previously I posted an article titled, “create Ajax and Flash® rich internet applications/websites from a single codebase!”, which was limited to exporting in either html, or flash. BUT NOW, we can compile with both SWF elements, and HTML elements, which means, we can leverage each technology for what it is best for while working in one development environment. And with the potential to be able to create for other run-times in the future, this is sounding more and more like a good thing to gain experience in. I want to develop my first application with it soon. Please go read the full blog post. [...]

  11. m carroll Says:

    http://www.3rdforce.com/audio/player.html
    A band site has a player that plays all songs instantly.
    I would like to be able to do this.

    Is the band site using open laszlo? If not does anyone know how they play the music files with no download delay?
    Thanks
    mc

  12. Josh Pope Says:

    I really think are you are on to something here, I think there are a lot of people realizing this right now. With javascript finally recieving some respect, thus support, then brilliant open-source frameworks - the possibilities are enormous, it’s finally cross browser, and it’s exciting.. I think it’s time to push the web further. I think this is the direction it is going and I believe, as developers, it is our obligation to make it happen.

  13. Alfred Says:

    Couldn’t get the example to work.
    No sound comes out of the window.
    Strange things happen if I try to open the example in another tab (windows opening and closing)

    Ubuntu Dapper Drake
    Firefox 2.0