Question

We have a design exception for mobile devices, which loads a different JS, layout, CSS and image files.

With FPC off, it works perfectly. However, when it is on, everyone gets the regular site (no exceptions).

I assume this is due to head.phtml being cached.

Is exclusion of head.phtml from FPC the way to go here? Or is something else at play?

If it’s the prior, what’s the best way to do it? Create a custom module with cache.xml, and mimic cache.xml from Enterprise/PageCache?

This is Magento EE 1.11.

Answer 1

If you can avoid it, don’t bypass the cache for any blocks. It will improve your user experience in the log run. However, there’s a few ways you could tackle this issue.

I’ve blogged here about disabling the cache on a per controller basis.
You could potentially use the same method for the moment, except with a different “if” condition.

Where I’m checking:

if ($action instanceof <controller_class_name>) {

You could just as easily use:

if ($user_is_mobile == true) {

Doing it this way would only get your mobile users working in the meantime. Really, the answer isn’t to disable or bypass the cache, it’s to use this same method to listen for the page request and assign different layout handles for mobile and non-mobile requests. Each layout handle will then cache accordingly.

Look into how you use handles in Layout Updates. From memory it’s something like this:

Mage::app()->getLayout()->getUpdate()->addHandle("mobile");

Then in your page.xml, add a new node called mobile, something like this

<mobile>
    <reference name="root">
        <remove name="mainHead" />
        <block type="core/template" name="mobileHead" />
    </reference>
</mobile>

Or something along those lines. This is insanely untested, but I hope you get the idea.

You could otherwise look at using responsive css depending on screen resolution.