Paulaner Cup des Südens

http://www.paulaner-cup-des-suedens.de

It may sound unlikely - but if you’re not only a fan of Yii but also of germany’s top football club FC Bayern Munich then this site is for you: Apply for a casting and perhaps play a match against one of the best football teams in the world.

The application was built with Yii 1.1.10. Development time including backend was about 1 month for 2 developers. Some exceeding features:

  • Both, frontend and backend where built with Bootstrap CSS framework with responsive design which drastically reduced development time
  • A package compressor for Js and CSS built around Yii’s built-in packaging system guarantees quick response times
  • Image processing is handled by an easy-to-use image storage system which takes care of auto-resizing, cropping and serving of all image data

hey, I live in Marseille, maybe I should be interested :)

Did you use the prettyphoto extension to show the youtube videos in a lightbox as seen on this page ?

The website loads really fast. Good work!

Yes, we use some very common jQuery plugins like prettyPhoto, tipsy and jCropper.

hi Mike,

even if I didn’t understand a word, that’s a good example of bootstrap customization ! Did you use any yii extension for bootstrap ?

ciao

B)

No, we only used a customized version of CHtml (https://github.com/yiisoft/yii/pull/373 ) and a helper function for the control-group divs. Bootstrap does not require lot of markup so we didn’t use any extension.

well done, looks good, loads fast

How did you manage to get the response times that fast? For the index site it just takes ~40ms to load. I mean you probably don’t have complex database queries but still this seems very fast to me. Did you take any specific actions to tune that or did it just turn out that well?

It’s a combination of several optimizations:

  • We serve jQuery from CDN

  • We combine all Js and CSS into one file each

  • We compress javascript and CSS and add a hash (created from content) to the filename. This way we can let the browser cache this files very long. If the file is updated, the filename will change and the browser fetches the new file. The compressor also does not have to touch the disk on every request - it stores the compressed filenames in cache, too (requires manual flush on deployment)

  • All image, css and js files are served with long expire times

Apart from that, bootstrap guarantees pretty lightweight markup, wich reduces pagesize.