All images in FBML get cached by Facebook’s servers. Facebook makes a request to your application, and as your application serves up <img/> tags, Facebook parses those images, ensures that they aren’t too big and that they meet various requirements, and then stores a copy of each image on the Facebook servers. From that point on, the cached version of your image on Facebook’s servers gets rendered by your browser, which saves your own servers from unneeded bandwidth costs.

Your images must be smaller than 50 MB, cannot be animated, and cannot be served as a script (a common method to track a cookie or even serve malicious code). This ensures quality among applications and keeps Facebook users feeling safe and secure when using your app. Images must be given as an absolute link to the callback URL that you specified in your application installation settings (described in Chapter 1).

If the cache of your image does not work for some reason, Facebook renders a blank image in your application. If you need to refresh your image from the Facebook cache, it is recommended you get your hands dirty with some actual Facebook API code. Look up the facebook.fbml.refreshImgSrc() API tag on the Facebook Developer Wiki for more information about how to do this (see http://developers.facebook.com/documentation.php?v=1.0&method=fbml.refreshImgSrc).

Facebook also recommends that application developers do not append cache breaking strings (random strings to break the image cache) to the end of their URLs. This ensures that if your image ever actually does change, there is only one version of your image on Facebook’s servers to update. It will also keep the load off your servers.