Embed PDF, DOC, DOCX, TIFF, and more with Google or MS Doc Viewers

When it comes to embedding non-html and non-image content on your website, you have a couple options with Google or Microsoft document viewer.
In my tests, MS’s office embed tool performs the best for embedding content, but you must “urlencode” the destination url. I also found MS fails on some urls so your milage may vary.

Office Apps Live Embed

https://view.officeapps.live.com/op/embed.aspx?src=http%3A%2F%2Fieee802%2Eorg%3A80%2Fsecmail%2FdocIZSEwEqHFr%2Edoc

The MS viewer scores 99 and 96 on the Google Pagespeed tool for Mobile and Desktop, respectively.

Google Docs Viewer has a couple urls to load documents through. Pagespeed, Pingdom, and Websitegrader tests show the “gview” url performs slightly better.

Vierwerng

https://docs.google.com/viewerng/viewer?url=http://blog.luke.lol/wp-content/uploads/2017/04/HelloWorld.pdf

GView

https://docs.google.com/gview?embedded=true&url=http://blog.luke.lol/wp-content/uploads/2017/04/HelloWorld.pdf


Update 2018-09-16: In my latest tests, the scripts still score about the same. GView being a little bit lighter (4 fewer requets, 200Kb less)

PageSpeed Score Yslow Score Time Size Requests Google PageSpeed
Mobile
Google
PageSpeed Desktop
Gview 98% 93% 2.4s 465KB 16 53/100 83/100
Viewerng 95% 93% 2.1s 662KB 20 54/100 82/100

Update 2020-12-27: Google Chrome Lighthouse Still favors the Gview document method:

Leave a Comment