I had a php command line process spawning child processes and [...]]]> The SSL/TLS process is a heavy one, it involves algorithm negotiation between client and server, key exchanges, cyphering, decyphering and authentication. But what’s surprising is, that the server you’re connecting to can directly influence the performance of your client and its CPU consumption.

I had a php command line process spawning child processes and connecting through SSL to a web server, in 2 scenarios. The first scenario was to an out of the box Apache httpd server with mod_ssl, and the second scenario was to an out of the box Nginx with the SSL module. Both were using the exact same box, and were “out of the box” meaning I used the default configuration for both.

In the first scenario I was able to spawn no more than 6 (!) php processes before the box running them began to show load, and the CPU queue started to fill up. Each php child was taking between 15%-30% cpu at any given moment.

In the second scenario, I was able to spawn 40 (!!) php child processes without the box being loaded. Each php child was taking around 1.5% cpu.

I’m no SSL expert, and there might be a way to configure Apache to inflict less load on the connecting client. There is also SSLSessionCache which might relieve load from both the server and the client. But the “out of the box” configuration shows that Nginx is a real winner again.

If you can, avoid SSL altogether. If not, terminate it at a front-end before proceeding to Apache.

It is important to note that the code on his demo uses window.location.hash, although it seems this practice [...]]]> I set out to write a short tutorial about cross domain ajax calls and communication between iframes using url hashes (fragments), but I found this great tutorial by Michael Mahemoff covering the subject inside and out.

It is important to note that the code on his demo uses window.location.hash, although it seems this practice should currently be avoided because of a known open bugs in the way Firefox URI-decodes document.location.hash when getting its value (could be considered an expected behavior and not a bug, but still different than any other browser). Facebook’s code uses substring on pathname, and it seems to work cross browser. Facebook also have on their wiki a nice visual explanation of how it works:

Until the HTML 5 postMessage is widely adopted, we will have to keep using this somewhat of a hack, but it works, that’s what’s important.

I usually live with the axiom that whatever you can find in the realm of Windows and proprietary software, you can easily find in the realm of Linux (any flavor) and open source. While this is indeed usually the case, when it comes to a Flex IDE for Ubuntu, there’s a real gap. Adobe has [...]]]>

I usually live with the axiom that whatever you can find in the realm of Windows and proprietary software, you can easily find in the realm of Linux (any flavor) and open source. While this is indeed usually the case, when it comes to a Flex IDE for Ubuntu, there’s a real gap. Adobe has their Flash IDE for willing and paying Windows users, and I am happy to say that I was one of these happy customers a while ago. But since then, Ubuntu has taken over my life, and when I set out to make a small Flex app a couple of days ago, I came across some hurdles. Not impossible to overcome, but not trivial as well.

The Options

There is no one complete solution for developing Flex on Linux. Many folks are looking for one, but there is still none to be found. There are many open source tools that cover vast areas of the ActionScript and SWF world, most of the listed on the wonderful osflash.org. Some of them are just right for you if you have a very specific task (like converting between formats, just compiling a bit of code, etc.), but none provide a complete IDE that lets you both drop in WYSIWYG elements and manually code some stuff, while easily maintaining complete control of what libraries are used.

The Choice

The choice then is to combine as few tools as possible. I have succeeded to get along with 2 tools: Flex Builder Linux Alpha, and Open Dialect.

Flex Builder Linux Alpha is an Adobe free product, which is a Flex build environment as a plugin for Eclipse. Don’t worry about the Alpha part, it seems like a very stable product, and besides eating up some memory, I had no problems with it. It is actually an exact replica of the Flex Builder for Windows, without the features of Design View, some wizards and the profiler.

Open Dialect is the most comprehensive attempt i’ve seen at creating a graphic WYSYWIG IDE for developing Flash. It has some basic characteristics of such an IDE, like a timeline with frames and key frames, and a graphic interface for creating shapes and editing their properties.

The Method

The development cycle is quite simple once you have these two tools running. Use Open Dialect for whatever graphic or animation you need, then grab the code from the “Document Script” tab, paste it to the Flex Builder in Eclipse, and start tweaking whatever is needed, add the MXML code etc. Open Dialect has great potential if it were to enable manual script editing, but currently it doesn’t.

Getting Things To Work

Requirements and Installation of Flex Builder Linux Alpha are covered on Adobe’s release notes. In short, you got to have Eclipse 3.3.x, Sun JRE 1.5.x and Firefox, and just follow the installation instructions there. Be sure to set Eclipse’s browser to Firefox, as mentioned in the release notes, and there are also a couple of guides to walk you through. Oh, and it’s very important to follow these instructions in order for your existing Eclipse plugins to survive the install. I installed the builder and lost my subclipse and collabnet merge plugin, and had to reinstall them.

Open Dialect uses the .NET framework, so you need Mono to run it. According to the installation instruction, you can either download pre-compiled binaries of Open Dialect, or download the source and compile, but then you need MonoDevelop as well. In my case, using apt-get install mono was enough, and Open Dialect ran like a charm.

Tweaking and Real Life Example

Let’s go through an example of how to make a rounded rectangle that gets its color through a FlashVar.

In Open Dialect:

1. Fire up Open Dialect.
2. Choose Rounded Rectangle from the Shapes list on the Items pane.
3. Draw a rounded rectangle on the canvas.
4. Set its X and Y to 0.
5. Go to the Document Script tab, select all the code and copy.

In Eclipse:

1. Fire up Eclipse, create a new Flex Project, name it “Test”, and go through the creation wizard (next, next, finish).
2. You are now editing Test.mxml which is a skeleton Flex app file. Paste everything you copied from Open Dialect into Test.mxml, instead of its current content.
3. Save.
4. Hey, we’ve got errors! That’s right, BListBox type is not defined. It’s because the script uses the “ActionScriptComponents” library that comes with Open Dialect, in which BListBox is declared, but we haven’t imported it yet, let’s do it.
5. Copy the directory /path/to/opendialect/ActionScriptComponents to /path/to/workspace/Test/src/
6. Run again.
7. Viola! Rounded rectangle showing up!

Now that we’ve covered the basics, let’s see how to pass FlashVars to our app. In order to do so, we need to understand what the Flex Builder environment does in build time — besides compiling the SWF, it also takes the file called index.template.html found in the html-template directory, and compiles it to a file called Test.html in the bin-debug directory, then fires this file in Firefox. So to pass FlashVars and process them in the script:

1. Open index.template.html
2. Scroll down to the javascript part under “hasRequestedVersion”, this is the part that runs the swf on our page (assuming we have javascript enabled and the correct version of the flash player).
3. Under

   "src", "${swf}",

   add

   "FlashVars", "color=0x000000",

4. Run once to see everything is working, and that we did not screw up the html template.
5. Add the following variable declaration where all other variable declarations are:

   private var rectColor:Number;

6. In init(), add the following line at the top of the function:

   rectColor = Application.application.parameters.color;

7. In the next line, where the shape properties are defined, change the last 2 colors (which in my case were 0×000000,0xFF0000) to rectColor,rectColor:

   RRect1A.Properties[0] = new ShapeProperties(0,0,120,172,"BRoundedRectangle",1,rectColor,rectColor);

8. Run again, see the rectangle is now black!

Conclusion

The field of Flex development on Linux is of course bound to change as time goes by, but for now it seems like it is still in its early unstable days. This was a brief demonstration of how to harness the IDE power of Open Dialect, and the development and build power of Adobe’s Flex Builder Linux Alpha, to create a working environment for developing Flex apps on Linux. It is by no means the simplest solution — my guess is that running Flex Builder on a Windows VMware could be easier, albeit costly — but this solution that I presented is of course free and conforms to the open source spirit. And, most importantly, can get you developing flex apps quickly and easily.

Have fun flexing!

A Couple of Sidenotes

• You don’t have to use the ActionScriptComponents library that comes with Open Dialect if you don’t intend to use tweening or frame events. You can use the regular mx.controls classes for just plain drawing.
• Flex applications tend to be big because the whole framework is included in the build. You can use RSL loading to cache the framework on the client side, or you can make a plain ActionScript Project instead of a Flex Project, still use mxml and just import the needed flash.* libraries. Both of these subjects are out of the scope of this post.

Internet Explorer expects a minimum sized [...]]]> Internet Explorer is a term you can’t stay indifferent to. Whenever you hear somebody say it, they either say it with a respectful awe, or they utter it with a developer’s pain. Today I was on the latter side of this indifference, when I fought a Wordpress bug.

Internet Explorer expects a minimum sized response content when receiving HTTP errors in the 400-500 area. If the content size received in the response is lower than this minimum, an arguably “Friendly HTTP Error Message” takes over, and displayed instead of the content.

This (rather obtrusive) behavior doesn’t go well with Wordpress wp_die() function, which is invoked on many occasions throughout the Wordpress code. This function sets the HTTP response status to 500, and then sends a very short html code containing any error message you’d like. These error messages are usually no more than a brief sentence, which results in a very small response content.

So take an IE7 browser, and try to post an empty comment on any Wordpress that is not upgraded to version 2.7 yet. See that friendly browser message? The same in Firefox produces the expected “Error: please type a comment.” message. Wordpress had already fixed this in 2.7 (you can copy their workaround) after some bug reports, but any installation prior to 2.7 which is still not upgraded (and many MU installations which always trail behind in the version releases) has this.

For any application other than Wordpress, be sure to go over this table of minimum content size for each HTTP status error code, and make sure your responses are long enough.

Apparently, sometimes being laconic is bad.