Description from extension meta
View source is dead. See how the browser renders a page, not just what the server sends.
Image from store
Description from store
A lightweight Chrome Extension that shows you how the browser has constructed (rendered) a page's original HTML into a functioning DOM, including modifications made by JavaScript.
An essential tool for web developers using JavaScript frameworks like Angular, ReactJS and Vue.js, and for SEOs to understand how search engines see your pages, especially considering Google's dynamic serving workaround.
Differences between raw and rendered versions are highlighted line-by-line showing how JavaScript has modified a page at render time.
----------------------------------------------------
There are 3 sections:
* Raw: The source code sent from the server to the browser before the DOM is rendered. The same as you'll see with traditional 'View Source' in the browser (after minor formatting tweaks)
* Rendered: The rendered page after the source has been interpreted into a DOM, including any modifications made by Javascript
* Difference: The difference between the rendered source and the raw source. Differences occur when JavaScript has modified the DOM.
----------------------------------------------------
Adaptive website?
If you serve different source code to mobile devices, emulate this easily with a mobile user-agent checkbox.
Dynamic serving for Google?
(More info: https://developers.google.com/search/docs/guides/dynamic-rendering)
Using Google's dynamic rendering workaround designed for Javascript-heavy sites? Just request the raw source as Googlebot and ensure perfect technical SEO. Works with GatsbyJS and Prerender.
----------------------------------------------------
Problems? Questions? Suggestions?
DM the developer: https://twitter.com/ItsHogg
----------------------------------------------------
Latest reviews
- (2025-01-26) whatnetworkph: I am not a techy guy, I just heard about it from FB and installed it for SEO purposes. When I click on the extension, there are three different sections, Raw, Rendered and Difference, and in difference section, there is a lot of code in red color, I think it is generated by rank math, should I remove it or not for SEO perposes? My website is https://whatnetwork.ph/
- (2024-07-24) Caden Williamson: This seems like an amazing tool over "Ctrl + U" Could you add a dark mode option?
- (2024-06-27) Crystal Carter: An essential bit of tech. I've been using it for years. Great stuff!
- (2024-06-19) Chris Lever: @john you already know I love this extension - used it for years now. Suggestion - can you add an additional code highlighter for shadow DOM? I'm really struggling to distinguish shadow DOM vs Rendered using your extension. We're connected on LinkedIn, message me if you need more info. Cheers, Chris
- (2024-04-21) Gehteuch nichtsan (RFDarter): does simply not work. html code gerateed with js is not shown at all
- (2024-04-21) Gehteuch nichtsan (RFDarter): does simply not work. html code gerateed with js is not shown at all
- (2024-02-15) Kaj Kandler: A great idea with good execution. However there is a small detail that makes it unusable for me. It is called up on the keyboard shortcut "Option+U", which is needed to type an Umlaut on an a qwerty keyboard. So I can't type umlaut anymore, because instead it calls up this tool.
- (2023-12-27) Suzanne Edelman: seems cool but it loses the $_POST so it's useless to me.
- (2023-12-27) Suzanne Edelman: seems cool but it loses the $_POST so it's useless to me.
- (2023-12-20) Javier Fernández Morell (Javier Morell): Hi, it would be very very useful if there was a checklist of the things I want to compare, so that I don't have to see the whole website code but just the elements I want. For instance, I just want to see differences in <link rel="canonical"> <meta name="robots"> and <title> tag, for the source code and rendered code. If I could see them at a glance, it would make this tool much more useful. Thanks!
- (2023-12-01) Steve Green: It's quite useful, but it doesn't work when I select the site access option "When you click the extension". I get the error message "Error getting rendered source. Return to site and re-launch View Rendered Source again" in the Rendered panel of the results page. I am testing this on our own website www.testpartners.co.uk. I can live with that and just change the setting to allow access to the website I am testing, in which case it works fine. Having used it for a couple of days, it would be much more useful if it could compare two snapshots of the DOM. On some websites almost the entire body changes on page load, so it's virtually impossible to identify any subsequent changes. I would like to be able to put a page into one state, take a snapshot of the DOM, put the page into a different state and view the changes in the DOM.
- (2023-08-05) Nenad Stojkovic: Amazing extension, keep the outstanding work!!
- (2023-08-05) Nenad Stojkovic: Amazing extension, keep the outstanding work!!
- (2023-06-28) Calvin Ke: Perfect extension, does exactly what it says. Keyboard shortcut works great.
- (2023-05-18) Glen Allsopp: This has been super useful on a *lot* of occasions. Thanks for making it, Jon!
- (2023-05-18) Glen Allsopp: This has been super useful on a *lot* of occasions. Thanks for making it, Jon!
- (2023-03-29) Works like a charm. Flawless opertation. Keyboard shortcut comes in very handy.
- (2022-07-19) Grumbly Curmudgeon Woodworks: Wow bro... you nailed it! I came on intending to WRITE this extension, found yours and all I can say is: this does all I planned and more. Mad props, yo.
- (2022-07-19) Grumbly Curmudgeon Woodworks: Wow bro... you nailed it! I came on intending to WRITE this extension, found yours and all I can say is: this does all I planned and more. Mad props, yo.
- (2022-04-05) Zachary Wiles: Thanks! Quickly showed me what was going on with my extension development issue. Works as advertised :D
- (2022-04-05) Zachary Wiles: Thanks! Quickly showed me what was going on with my extension development issue. Works as advertised :D
- (2022-03-23) M C: This has been a five star extension for years. However, it has recently stopped working on tons of sites. Clicking the toolbar button does nothing at all. On this webpage, for example.
- (2022-03-23) M C: This has been a five star extension for years. However, it has recently stopped working on tons of sites. Clicking the toolbar button does nothing at all. On this webpage, for example.
- (2021-11-24) Kai Shien Ooi: Nice extension! Love it when it shows 2 type of source. Will appreciate it if you can add a dark mode version for us to toggle? THanks!
- (2021-11-24) Kai Shien Ooi: Nice extension! Love it when it shows 2 type of source. Will appreciate it if you can add a dark mode version for us to toggle? THanks!
- (2021-10-26) Rob Woods: Not sure how I did SEO or QA without this. I literally use it almost every time I look at the source code of a page now.
- (2021-10-26) Rob Woods: Not sure how I did SEO or QA without this. I literally use it almost every time I look at the source code of a page now.
- (2021-10-03) Tonatiuh Moctezuma: NO sirve...
- (2021-10-02) Gaurav Kumar Srivastava: just what SEO needed..! Thanks Team..! <3
- (2021-10-02) Gaurav Kumar Srivastava: just what SEO needed..! Thanks Team..! <3
- (2021-07-17) Paddy Landau: Perfect! Works first time, and gives plenty of information.
- (2021-07-17) Paddy Landau: Perfect! Works first time, and gives plenty of information.
- (2021-01-27) Bert Saper: Seeing the rendered code, which could not be displayed in DevTools | Elements, solved a huge problem.
- (2021-01-27) Bert Saper: Seeing the rendered code, which could not be displayed in DevTools | Elements, solved a huge problem.
- (2021-01-21) Justin Sinclair Thomson: A really useful extension, and the developer Jon even provides great support on Twitter - I strong recommend this extension.
- (2021-01-21) Justin Sinclair Thomson: A really useful extension, and the developer Jon even provides great support on Twitter - I strong recommend this extension.
- (2021-01-13) Rafael Medici: Hey, great tool!! congrats. Is possible view rended code with API?
- (2021-01-13) Rafael Medici: Hey, great tool!! congrats. Is possible view rended code with API?
- (2020-10-09) Stanton McCandlish: Update: The minor issues I mentioned below were either operator error in one case, or something I can't reproduce now in the other. So, I'm upgrading to 5 stars, since this just works. Original review: Generally good, and much faster than another utility of this sort that I tried (which didn't do diffs, even). However, I find that it fails (just does nothing at all) at various sites, including this one. I tried it on its own Chrome Store page, and nothing happened. Various "big company" sites should not be magically immune to source examination. What they're sending to my system actually being rendered on my system is a privilege I grant them, not a right they have. >;-) Sometimes it also partially fails: it will not work by clicking on its icon but will work if you use its contextual menu item instead. That just happened to me at support.microsoft.com, for example. And in some cases, that was the result at first, then the icon DID work, but only after the context menu had done the work once already (again at support.microsoft.com). So, definitely some kinks to work out. Just the fact that it works, and so well, so much of the time makes it very useful, though, even if I will keep another extension of this sort (the slow one) on hand just in case.
- (2020-10-09) Stanton McCandlish: Update: The minor issues I mentioned below were either operator error in one case, or something I can't reproduce now in the other. So, I'm upgrading to 5 stars, since this just works. Original review: Generally good, and much faster than another utility of this sort that I tried (which didn't do diffs, even). However, I find that it fails (just does nothing at all) at various sites, including this one. I tried it on its own Chrome Store page, and nothing happened. Various "big company" sites should not be magically immune to source examination. What they're sending to my system actually being rendered on my system is a privilege I grant them, not a right they have. >;-) Sometimes it also partially fails: it will not work by clicking on its icon but will work if you use its contextual menu item instead. That just happened to me at support.microsoft.com, for example. And in some cases, that was the result at first, then the icon DID work, but only after the context menu had done the work once already (again at support.microsoft.com). So, definitely some kinks to work out. Just the fact that it works, and so well, so much of the time makes it very useful, though, even if I will keep another extension of this sort (the slow one) on hand just in case.
- (2020-09-11) Noah Learner: Fantastic tool. I just shared it on twitter so other folks could learn about it.
- (2020-09-11) Noah Learner: Fantastic tool. I just shared it on twitter so other folks could learn about it.
- (2020-08-18) 358 Ffdfbe: Awesome! It helps a lot when I develop web scratch. If it can highlight tags name in the HTML text, it would be perfect!
- (2020-08-18) 358 Ffdfbe: Awesome! It helps a lot when I develop web scratch. If it can highlight tags name in the HTML text, it would be perfect!
- (2020-04-03) Michael Cottam: OK, this is pretty darn fabulous. Thanks Jon! Brilliant tool, I'll be using it every week, if not every day, for my SEO site audits. Cheers!
- (2020-04-03) Michael Cottam: OK, this is pretty darn fabulous. Thanks Jon! Brilliant tool, I'll be using it every week, if not every day, for my SEO site audits. Cheers!
- (2020-01-29) Saijo George: This extention is dope, thanks for making it Jon
- (2020-01-29) Saijo George: This extention is dope, thanks for making it Jon
- (2020-01-18) Scot: Fantastic developer extension, thanks for your efforts!!
- (2020-01-18) Scot: Fantastic developer extension, thanks for your efforts!!