Driven to the …Edge!
Well, what can I say? It’s dark days indeed.
Never mind Global Pandemics, Brexit, American (near) Revolution over a tosser, or the Kremlin being haunted by a dissident which someone tried to assassinate- who returned to clean up shop.
NO forgot it.
All that pales into insignificance when compared to the torture of trying to …
View a web page.
DOM structure in… 3D View.
Yes, I use a computer.
It can do amazing things.
But do YOU THINK>… I can LOOK AT SOMETHING?
just VIEW IT?
…from a different angle?
GOD!
What a chore.
Web Pages are basically 3 Dimensional structures.
They have depth.
Layer upon layer of stuff, with some things going
PEEK A BOO!
from Underneath, rising up to the surface and blinging away merrily on the surface of my web page, via the Z-index, which are kind of notoriously difficult to debug.
So just my container on the bottom of my desk work surface, then I stick some divs on,
Some stuff then goes in or ON them… then pics, then then…
SO its like a contour map in the end.
…and i want to see it as such and indeed ,
Previously I COULD… but
do you think I can NOW?!
GAH!
and it is this desire to view my handy work in 3d which has driven me to ,
auto update, personal information sharing, diagnostic data sent… with NO OPT OUT
UGH.
EULA.
yes… HorrorSoft… and… the … EDGE.
This is the story.
SO back in the day, I remember getting my tiny Hello World web page mind blown by
the 3D web page render view… which I first saw in Firefox… it might have been FF 11.
it was fab!
It was brought about by the Tilt Extension to firefox
This functionality was created by a clever Romanian chap, called
Victor Porof, around 2011
you can still find the original GitHub Plugin repository Here
and then a mozilla project wiki
https://wiki.mozilla.org/Tilt_Project_Page
Then, he got hired by Mozilla firefox dev team as seen on this site,
https://blog.mozilla.org/meeting-notes/archives/date/2011/page/8
here is a link to a devs blog, that mentions its dev.
Then Firefox, (after hiring him) had him working with 2 others, Cedric Vivier and Rob Campbell and employed his Tilt Extension, natively into Firefox itself as mentioned here
And released it here, around 2012
Yay!!!
aaaaaand then kills it in FF version 47…
https://developer.mozilla.org/en-US/docs/Tools/3D_View
Boooo!
Now this fine, now native thing, worked up until… and including FF ESR 46 gah.
(due to multiprocess incompatibilities and other things)
But the original Tilt extension worked up until and including FF v 52
providing you found THIS info… and the shortcuts! -if you couldnt find the native 3D button
or the Tilt section in dev tools.
Without those shortcuts or the button…or the TIlt menu option, life was a monotonous single layer.
Victor Prokov, then disappeared from that scene, his plugin vaporised from firefox extensions.
But he is still a rather busy clever teddy as can be seen by the rest of his more current Github stuff.
And, if you look at his pic, remove the hair, put him back 10 years in time, it probably means he wrote the plugin when he was 12 or something 
…
But, it wasn’t always plain sailing to get this to actually get it to work!
Then it was all this sort of the following malarky to get it to work
and
so that was about NINE years ago… since 2016, when 3D view was no longer available natively in FF 47, people are STILL asking why and where has it gone?
That was it, gone, just… GONE.
A major visualisation tool and concept just dropped due to some technical, unsupportable …thing, with no work around sorted.
For YEARS.
It left the scene in 2016 and then not until MS started tinkering did it start to make a come back.
And it wasn’t terribly easy to fathom out or activate when they started playing with it.
I mean…
…and this was an improvement on the earlier version…
The meaningful bit of that link in relation to this was this bit.
I mean, how was this for a set of user friendly instructions to follow… just to ACTIVATE the tool!?
and, they’d kept changing the bloody interface so you couldn’t find the controls!
Now isn’t that just infuriating?
Now, which app do we know that also evolves really quick and keeps changing the interf…
Oh never mind, 
Where was I? Oh yes…
Gutted.
SO webbing got harder, more complex, convoluted and with Increased depth to content layout.
And the main decent tool to explore this depth, had been kicked into touch.
Madness.
SO I kept my OLD browsers, NOT updated, so I could STILL look at stuff in 3D, when the mood took me, and my mind was boggled by layers and depth of things, z-index which I habitually forget…cascades…etc
So Firefox 46 for native 3D View, as well as Tilt extension
and
Firefox 52 for Just the Tilt extension in a Slightly Newer (But still Obsolete) Browser.
*** UPDATE!!! ***
- Spoiler ALERT! * go to the end!! something here now works that didnt before… woo hoo!!*
Ha! Me Clever…
buuuuuut, then the web changed.
GAH! again.
Cue… CSS Grid.
Awkward.
This sort of stuff does NOT show up in old browser… renders all wrong and… cant be seen.
here we go, My tinkery Horseblog page in 3D View in FF46.
after doing 2 things. Here we go.
First click these 2 options.
Then you see the 3D cube of much Clickyness! -
CLICK IT
And then I get to see my CSS Grid Web Page in all its aweful lack of… CSS GRID.
But in 3D!
SO then I try the Tilt Plugin’s render aaand.
see the similarity and equally similar lack of … CSS GRID render?
pants!
Still, it can still do a rather dandy representation of this far more basic and less modern website…
Cough cough…
hee hee… look familar?
SO fast forward to 2019 and…
THIS!
Canary engine and… gulps… EDGE… yes, MicroWhore… were inspired by FF plugin… Tilt
(Makes a nice change from Embrace, Extend, Extinguish)
And found This…which I wasn’t actually aware of at the time (Horses… remember?)
I recently searched a bit and found the devs input, about why and how it came about etc.
https://bugs.chromium.org/p/chromium/issues/detail?id=987787
referring to the history of FF’s efforts etc.
So Then I find myself…>
Glaring… yes
GLARING>… at the bloody microsoft download page…
And… I … HAVE…to do… … IT!!
Mea Culpa!
There is NO alternative… none
I want to view…
CSS Grids in … 3D
And MS have … picked up the Baton, from where FF tossed it onto the ground, by the dog poo.
So anyway… I am then tortured by the MS EULA
and you MUST share info… there is NO way out of it. no way.
GRRRrrrr.
Were they being ironic when they juxtapositioned those two informatics next to each other?
Tossers.
SO I turned internet off as installing. It offered me to play a game, until I re enabled it!
A bit like their annoying MS Office Paper clip.
Dink DInk Dink… it looks like your to trying to wite a letter/foil my data harvesting… sort of pop up.
, disabled auto updates, even as it constantly attempts anyway.
And ran it.
…after going through preferences, turning off a myriad things.
And after fumbling around I FINALLY , got to this view of the dev tools…
and got to see this…
…tiny …postage stamp of my Web Page… bottom right of dev tools.
WHAT USE IS THAT!?
This is after quite a bit of laggy zooming in.
then found the dev tools , in new window icon… expanded it and -got a separate dev tools window
on…
THE OTHER MONITOR! Oh yes.
FINALLY!
After quite a lot of years… there it is…
TADA!!!
SO, The Enemy of my Enemy is my friend…
FireFox ditched my wonder tool for the hard of thinking…
AND… MS… who isn’t anyones best friend really… picked up the baton, wiped off the dog poo and ran with it.
I now have an application running on my Mac, that offers NO OPTION to turn off telemetry.
GRRRrrrr
But I can see pretty 3D, renders of web pages.
MS, might as well just start writing pRon Sites… carrot dangling nastyness.
So there you go.
After just hacking my Mojave installer… re partitioning it all to get it much more up to date, I then had to install 2012- 2016 browsers, just to fail to render css Grid in 3D, but to render other DOM visualistions pretty well.
The very long winded History of 3D web Page view and DOM structure visualisation, which now the latest canary Build of Edge …employs.
Please please please let some other Browser dev get back with the plan and reinstate this so I can ditch Edge… just as a lot of other Windows users are frothing at the bit about a forced upgrade to Edge, I have VOLUNTEERED to… host this nastyness, to feed my defective inner web beast.
Gah!
there I hope that was informative for someone.
If you have never used this sort of tool, as you took to web dev, in the interloping years before or after its respective dev and demise, its back, and this should now do both CSS Grid AND Z-index etc.
worth checking out… spits even… if its…from… from… I just cant say it.
MS.
there, thats close enough.
PS, its taken me HOURS to write all of this!
ITs 4am and I only cooked my food at 2 am!
Bed… after some 3D rendering of web pages.
WOoo Hoo!!
I hate myself…right now… MS…gah
UPDATE REPRIEVE
it works!!
Firefox vr56, with the TIlt plugin, WORKS! and renders the CSS GRID!!
woo hoo.
check it out.
FF 56 download.
https://ftp.mozilla.org/pub/firefox/releases/56.0.2/mac/en-GB/
then download the .xpi from here
and double click it to install in FF 56.
I had it installed in 46 -and it appeared as a legacy plugin in 56.
You dont have to surf the web with this thing, but turn off auto updates and use it as a visualisation tool.
