This document discusses the differences between client-side rendering and server-side rendering and their impact on search engine optimization (SEO). Client-side rendering means content is generated by JavaScript on the client-side/browser, so search engines cannot see it, negatively impacting SEO. Server-side rendering generates content on the server and sends fully rendered HTML to browsers, allowing search engines to index content. Isomorphic JavaScript is an alternative that renders content both client-side and server-side to improve performance and SEO. The document recommends determining whether to use server-side rendering or isomorphic JavaScript going forward to balance SEO and performance.
2. What Is Server-Side Scripting?
• Server-side scripting is a
method of programming for the
web that runs software on the
server rather than the browser
or installed plugins to create
dynamic web pages.
• Languages used for these tasks
are normal programming
languages which include Perl,
PHP, JSP, Ruby, ColdFusion, and
Python
2
3. What Is Client-Side Scripting?
• Client-side scripts are placed within
an HTML document in the user’s web
browser rather than the web server
to allow greater interactivity in a
document. For example – client-side
scripting could check the user’s form
for errors before submitting it
• Enables web pages to change content
according to user input and other
variables, including the time of day.
Can also be stored in a separate file
that is referenced to the documents
that use it.
3
4. Client-Side vs. Server side
• Your content is visible to search
engines like Google.
• Fast Initial Load. There's no
"white page" while the browser
downloads the rendering code
and data and runs the code.
• It maintains the idea that pages
are documents, and if you ask a
server for a document by URL,
you get back the text of the
document rather than a program
that generates that text using a
complicated API.
Server Side Client Side
• Allows for more interactivity
• Fast on subsequent requests
• You can update the screen
instantly without going to the
server when the user clicks,
rather than waiting a few
hundred milliseconds
• SEO. Client-side rendering
means that crawlers cannot
index and rank the site/page.
Negatively impacts our valuable SEO
traffic 4
5. Why You Should Care About SEO?
• In 2016, SEO accounted for X% of total XXXX Sales.
• Sales through SEO increased by X% in 2016
5
SEO Performance Chart Goes Here
(Removed for Confidentiality)
6. Client-Side and SEO (Example)
What Search Engines “See”
http://social.macys.com/health-and-wellness/
• Search engines can find the page but cannot read the content on the page.
• They are getting better about understanding JavaScript, but aren’t quite there yet.
VS.
6
8. Handling JS Heavy Site
OR
Isomorphic Java Script
REF: https://strongloop.com/strongblog/node-js-react-isomorphic-javascript-why-it-matters/
8
The SEO recommendation is steadfast on either:
10. Next Steps/ Conclusion
• Client-Side Rendering impacts SEO traffic and sales to the site.
• Its proven (i.e. Active page example on MCOM) that
content rendered client-side is lost to SEO…if we value
SEO, the content simply must come from the server
Summary
Next Steps/ Recommendation
• Determine if we want to move forward with Server Side or
Isomorphic JS
10