Sponsored by Nike, US Sports Camps is a fabulous yet accessible nationwide directory of sports camps for adults, teenagers and children.

Colorado-based OptiSite won the tender to redesign ussportscamps.com and migrate it from an ASP-based content management system to ExpressionEngine. As the data structure and screen output grew in complexity, Terry Evans at OptiSite’s development partner, Vancouver-based vibe9design.com, contacted Engaging.net to assist with the EE backend.

The data challenge

The first challenge posed to Engaging was to display a sport’s camps grouped by sponsor, program, type, region and city. The difficulty was the disconnect between the organizational channels (sports, sponsors, programs and camp types) and the geographic ones (regions, cities).

To get our set of camps, we looped through each program as determined by the sport and sponsor, then through each resulting camp’s type. But how then to display the selected camps by region and city?

By filtered loops. First, we got the set of all our selected camps’ regions and cities, then looped through the regions, displaying for each region any of its cities also found in our set of cities, then within each of these cities any of its camps in our camps set.

It worked, but was altogether a bit crazy, as we’d discover later.

The URL challenge

Another challenge was that the SEO-dictated URL structure for this particular site goes against the natural EE grain; instead of a URL’s segment #1 being the content type and segment #2 the particular content item, here segment #1 is the sport, #2 the sponsor, and #3 a particular camp, region or camp type. And if the camp in segment #3 does not belong to the sport in segment #1 and the sponsor in segment #2, then for SEO reasons the page redirects to the camp’s correct and only URL.

We achieved this URL structure by serving all pages from a single main site/index template that springs off conditionally to various embedded templates.

But this too created a major problem, as we’d also discover later.

The legacy challenge

The site has hundreds of legacy URLs to redirect to their new, SEO-friendly replacements. We automated many of these by having templates parse their URL query strings to derive and do the redirects. For the remainder we set up a Redirects channel.

Therefore the first thing that the site/index template does is check against all the entries in the Redirects channel. Only if there are no results does it proceed to serve a page, otherwise it redirects to a URL specified in a Redirects channel field.

Bill Blitz of OptiSite, pleasantly surprised that automated redirects could even be done, calls the setup “a thing of great beauty.”

The performance challenge

So what were the horrors that we came to discover? That some of this functionality comes at a deadly price: performance. Firstly, the server was overloaded by the many loops within loops required to display the camps by region and city within sport, sponsor, program and camp type. Derek Jones, EllisLab’s CTO, stepped in here, insisting that the efficiency simply had to somehow be improved. Secondly, the single template enabling SEO-determined URLs violates EE’s template caching method, resulting in uncached complex pages that could take up to 20 seconds to load.

We solved the server load problem by changing our display method from filtered loops to extended objects; instead of gathering all the pertinent camps’ regions and cities and doing the loops and filters as described above, we extended the initial set of camps to contain their regions and cities and be sorted by them. This was achieved with a single SQL query, rather than the crazy 200 or so generated by the filtered loops method.

We then regained template caching by creating templates for each of the first and second segments in URLs, ie, the various sports and sponsors (which fortunately at this site are reasonably static and few in number). The content of these templates is all identical — each simply points back to the site/index template — but they serve as hooks on which to hang template caches. Thus fully reinstated, template caching enables pages to load almost instantly.

All this smooth backend functionality is however merely handmaiden to the exciting interface produced by OptiSite and Vibe9 Design — furthermore it’s only one part of this extensive site, which also features maps and a registration system. You can read more about the site at Vibe9 Design and view its Show-EE page. Thank you Derek for your pointers, Bill for being such a great guy to work for, and Terry for late-night Skyping and bringing Engaging aboard to help you revitalize this national treasure.