How can I add multiple feOffset shadows in an SVG filter?

I want to create a faux extrusion effect by stacking multiple feOffset in my filter.

Is this possible?

Something like:

<svg height="150" width="150" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="f1" width="120" height="120">
      <feOffset in="SourceAlpha" dx="10" dy="10" />
      <feBlend in="SourceGraphic" in2="offOut" />
      <feOffset in="SourceAlpha" dx="20" dy="20" />
      <feBlend in="SourceGraphic" in2="offOut" />
    </filter>
  </defs>
  <rect width="90" height="90" fill="yellow" filter="url(#f1)" />
</svg>

Yes it's possible - multiple ways of doing it. The most straightforward is to do multiple offsets, label each one with a result and then use a feMerge to condense them. (The code that you have won't retain the result of the first offset, it will be discarded. You have to label something with a result= if you want to use it as an input to anything other than the next primitive.)

<svg height="150" width="150" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="f1" width="120" height="120">
      <feOffset in="SourceAlpha" dx="10" dy="10" result="off1" />
      <feOffset dx="10" dy="10" result="off2"/>
      <feOffset dx="10" dy="10" result="off3"/>
      <feMerge>
          <feMergeNode in="SourceGraphic"/>   
          <feMergeNode in="off1"/>
          <feMergeNode in="off2"/>
          <feMergeNode in="off3"/>
      </feMerge>
    </filter>
  </defs>
  <rect width="90" height="90" fill="yellow" filter="url(#f1)" />
</svg>