Presentation delivered on 12.04.19, at April's edition of Brighton SEO. Contains an introduction, basic & more advanced usages of Chrome Puppeteer, Headless Chrome & how you can use it to monitor your site!
How To Make Any Site Blazing Fast!!! Tom Pool - London SEO Meetup Jan'20Tom Pool
Originally presented at Blue Array's January LondonSEOMeetup.
In this mobile-first world, it is massively important for all websites to be as fast as possible, to ensure the user can access content as soon as possible. This talk focused on the multitude of things that you can do to ensure any site is as fast as possible. Themes discussed included HTTP/3, image optimisation, optimising the critical rendering path and minimising the number of requests.
HTTP/2 can help improve the performance of your site, and is a technology SEOs should have an understanding of. This deck gives you an accessible top level introduction as an SEO.
Your content is the most important feature of your website, so it's important to make sure that the text looks good and is easy to read no matter what device type or screen size it's being viewed on. One size does not fit all when it comes to typography, but you can use media queries to adjust type qualities such as size, line height, column width, margins, hyphenation, and even typeface depending on the viewport size. Learn how you can use CSS to apply design rules that will make your typography look better and perform better across devices. You'll also find out how typography affects the loading time of your website, and what you can do to improve performance.
Presented in 2015 at ConFoo and Albany UX. Presented in 2014 at WebVisions Chicago, Blend Conference, Frontend Conference Zurich, Refresh Ottawa, Mobile+Web Dev Conference, STC Summit, Bmoresponsive, ConvergeSE, and Girl Geeks Montreal.
Everyone's talking about writing APIs, but before you ever write your own API you should have experience using someone else's. But authentication keys, tokens, REST, JSON, endpoints-- it's a lot to learn, and hard to know where to start. This presentation will break down everything you need to know to get started with some of the most popular publicly-accessible APIs on the web, like Flickr, LinkedIn, and last.fm. From choosing an API, to authenticating, to accessing the data so you can work with it again in your own code, we'll demystify the whole path so you have no reason not to jump in and get started.
How To Make Any Site Blazing Fast!!! Tom Pool - London SEO Meetup Jan'20Tom Pool
Originally presented at Blue Array's January LondonSEOMeetup.
In this mobile-first world, it is massively important for all websites to be as fast as possible, to ensure the user can access content as soon as possible. This talk focused on the multitude of things that you can do to ensure any site is as fast as possible. Themes discussed included HTTP/3, image optimisation, optimising the critical rendering path and minimising the number of requests.
HTTP/2 can help improve the performance of your site, and is a technology SEOs should have an understanding of. This deck gives you an accessible top level introduction as an SEO.
Your content is the most important feature of your website, so it's important to make sure that the text looks good and is easy to read no matter what device type or screen size it's being viewed on. One size does not fit all when it comes to typography, but you can use media queries to adjust type qualities such as size, line height, column width, margins, hyphenation, and even typeface depending on the viewport size. Learn how you can use CSS to apply design rules that will make your typography look better and perform better across devices. You'll also find out how typography affects the loading time of your website, and what you can do to improve performance.
Presented in 2015 at ConFoo and Albany UX. Presented in 2014 at WebVisions Chicago, Blend Conference, Frontend Conference Zurich, Refresh Ottawa, Mobile+Web Dev Conference, STC Summit, Bmoresponsive, ConvergeSE, and Girl Geeks Montreal.
Everyone's talking about writing APIs, but before you ever write your own API you should have experience using someone else's. But authentication keys, tokens, REST, JSON, endpoints-- it's a lot to learn, and hard to know where to start. This presentation will break down everything you need to know to get started with some of the most popular publicly-accessible APIs on the web, like Flickr, LinkedIn, and last.fm. From choosing an API, to authenticating, to accessing the data so you can work with it again in your own code, we'll demystify the whole path so you have no reason not to jump in and get started.
Google Sheets For SEO - Tom Pool - London SEO Meetup XLTom Pool
First delivered at London SEO Meetup XL on May 4th, 2022.
This talk focuses on a number of different tips and tricks that can be used to help improve the overall analysis of data within Google Sheets.
A number of formulae are covered within this talk, including:
REGEXMATCH & REGEXREPLACE
TRANSLATE
COUNTIF
VLOOKUP
INDEX MATCH
IFNA
The talk finally touches on the usage of the =QUERY formula, and how it can aid in a number of different situations. An example of creating a top ten dashboard is provided.
A sample Google Spreadsheet with all formulae discussed can be seen here:
https://docs.google.com/spreadsheets/d/1vMZIh6NWm8gRwIP-SkTP0N6BWEpYmFFge7FBR4Wqqtg/edit#gid=0
SEO Of Tomorrow_ The Rise Of Automation.pdfTom Pool
A presentation delivered by Tom Pool, at the November 2023 edition of London SEO. Covers a wide range of potential automations & tips for automating certain workflows.
The Journey of Chaos Engineering Begins with a Single StepBruce Wong
PagerDuty Summit 2016
Presenters: Bruce Wong, James Burns
https://www.pagerduty.com/pagerduty-summit-2016/
Heard of Netflix' Chaos Engineering & the Simian Army? Google's legendary DiRT exercises? Hear about how Twilio is getting started on its journey with Chaos Engineering. This talk is the story of how Twilio got started with Chaos Engineering, lessons learned, and the impact to our engineering culture.
How to build simple web apps to automate your SEO tasks - BrightonSEO Spring ...Charly Wargnier
Time to speed-up your SEO workflows!
In this talk, I will show you how to:
+ Build simple Python Web apps to automate your tasks via the mighty Streamlit framework
+ Deploy them in one click and for free, so you can share them with your teammates (or the word!)
I'll finish the talk with some exciting use cases!
Media horita de funcionalidades y secciones del inspector de Chrome que se pueden usar para exprimir los análisis SEO de nuestros proyectos.
Recursos de interés:
https://developers.google.com/web/tools/chrome-devtools/
https://searchengineland.com/chromes-devtools-seo-10-ways-use-seo-audits-266433
https://www.onely.com/blog/chrome-developer-tools-overview/
https://trafficthinktank.com/google-chrome-technical-seo/
https://codeseo.io/google-chrome-seo-without-a-plugin/
https://www.reddoor.biz/blog/chrome-developer-tools-9-hacks-for-an-seo/
http://anti-code.com/devtools-cheatsheet/
https://code.tutsplus.com/articles/chrome-dev-tools-networking-and-the-console--net-28167
Understanding Globus Data Transfers with NetSageGlobus
NetSage is an open privacy-aware network measurement, analysis, and visualization service designed to help end-users visualize and reason about large data transfers. NetSage traditionally has used a combination of passive measurements, including SNMP and flow data, as well as active measurements, mainly perfSONAR, to provide longitudinal network performance data visualization. It has been deployed by dozens of networks world wide, and is supported domestically by the Engagement and Performance Operations Center (EPOC), NSF #2328479. We have recently expanded the NetSage data sources to include logs for Globus data transfers, following the same privacy-preserving approach as for Flow data. Using the logs for the Texas Advanced Computing Center (TACC) as an example, this talk will walk through several different example use cases that NetSage can answer, including: Who is using Globus to share data with my institution, and what kind of performance are they able to achieve? How many transfers has Globus supported for us? Which sites are we sharing the most data with, and how is that changing over time? How is my site using Globus to move data internally, and what kind of performance do we see for those transfers? What percentage of data transfers at my institution used Globus, and how did the overall data transfer performance compare to the Globus users?
Unleash Unlimited Potential with One-Time Purchase
BoxLang is more than just a language; it's a community. By choosing a Visionary License, you're not just investing in your success, you're actively contributing to the ongoing development and support of BoxLang.
Custom Healthcare Software for Managing Chronic Conditions and Remote Patient...Mind IT Systems
Healthcare providers often struggle with the complexities of chronic conditions and remote patient monitoring, as each patient requires personalized care and ongoing monitoring. Off-the-shelf solutions may not meet these diverse needs, leading to inefficiencies and gaps in care. It’s here, custom healthcare software offers a tailored solution, ensuring improved care and effectiveness.
Software Engineering, Software Consulting, Tech Lead.
Spring Boot, Spring Cloud, Spring Core, Spring JDBC, Spring Security,
Spring Transaction, Spring MVC,
Log4j, REST/SOAP WEB-SERVICES.
Code reviews are vital for ensuring good code quality. They serve as one of our last lines of defense against bugs and subpar code reaching production.
Yet, they often turn into annoying tasks riddled with frustration, hostility, unclear feedback and lack of standards. How can we improve this crucial process?
In this session we will cover:
- The Art of Effective Code Reviews
- Streamlining the Review Process
- Elevating Reviews with Automated Tools
By the end of this presentation, you'll have the knowledge on how to organize and improve your code review proces
Listen to the keynote address and hear about the latest developments from Rachana Ananthakrishnan and Ian Foster who review the updates to the Globus Platform and Service, and the relevance of Globus to the scientific community as an automation platform to accelerate scientific discovery.
Large Language Models and the End of ProgrammingMatt Welsh
Talk by Matt Welsh at Craft Conference 2024 on the impact that Large Language Models will have on the future of software development. In this talk, I discuss the ways in which LLMs will impact the software industry, from replacing human software developers with AI, to replacing conventional software with models that perform reasoning, computation, and problem-solving.
Globus Compute wth IRI Workflows - GlobusWorld 2024Globus
As part of the DOE Integrated Research Infrastructure (IRI) program, NERSC at Lawrence Berkeley National Lab and ALCF at Argonne National Lab are working closely with General Atomics on accelerating the computing requirements of the DIII-D experiment. As part of the work the team is investigating ways to speedup the time to solution for many different parts of the DIII-D workflow including how they run jobs on HPC systems. One of these routes is looking at Globus Compute as a way to replace the current method for managing tasks and we describe a brief proof of concept showing how Globus Compute could help to schedule jobs and be a tool to connect compute at different facilities.
Cyaniclab : Software Development Agency Portfolio.pdfCyanic lab
CyanicLab, an offshore custom software development company based in Sweden,India, Finland, is your go-to partner for startup development and innovative web design solutions. Our expert team specializes in crafting cutting-edge software tailored to meet the unique needs of startups and established enterprises alike. From conceptualization to execution, we offer comprehensive services including web and mobile app development, UI/UX design, and ongoing software maintenance. Ready to elevate your business? Contact CyanicLab today and let us propel your vision to success with our top-notch IT solutions.
OpenFOAM solver for Helmholtz equation, helmholtzFoam / helmholtzBubbleFoamtakuyayamamoto1800
In this slide, we show the simulation example and the way to compile this solver.
In this solver, the Helmholtz equation can be solved by helmholtzFoam. Also, the Helmholtz equation with uniformly dispersed bubbles can be simulated by helmholtzBubbleFoam.
Top Features to Include in Your Winzo Clone App for Business Growth (4).pptxrickgrimesss22
Discover the essential features to incorporate in your Winzo clone app to boost business growth, enhance user engagement, and drive revenue. Learn how to create a compelling gaming experience that stands out in the competitive market.
More Related Content
Similar to BrightonSEO April 2019 - Tom Pool - Chrome Puppeteer, Fake Googlebot & Monitor Your Site!
Google Sheets For SEO - Tom Pool - London SEO Meetup XLTom Pool
First delivered at London SEO Meetup XL on May 4th, 2022.
This talk focuses on a number of different tips and tricks that can be used to help improve the overall analysis of data within Google Sheets.
A number of formulae are covered within this talk, including:
REGEXMATCH & REGEXREPLACE
TRANSLATE
COUNTIF
VLOOKUP
INDEX MATCH
IFNA
The talk finally touches on the usage of the =QUERY formula, and how it can aid in a number of different situations. An example of creating a top ten dashboard is provided.
A sample Google Spreadsheet with all formulae discussed can be seen here:
https://docs.google.com/spreadsheets/d/1vMZIh6NWm8gRwIP-SkTP0N6BWEpYmFFge7FBR4Wqqtg/edit#gid=0
SEO Of Tomorrow_ The Rise Of Automation.pdfTom Pool
A presentation delivered by Tom Pool, at the November 2023 edition of London SEO. Covers a wide range of potential automations & tips for automating certain workflows.
The Journey of Chaos Engineering Begins with a Single StepBruce Wong
PagerDuty Summit 2016
Presenters: Bruce Wong, James Burns
https://www.pagerduty.com/pagerduty-summit-2016/
Heard of Netflix' Chaos Engineering & the Simian Army? Google's legendary DiRT exercises? Hear about how Twilio is getting started on its journey with Chaos Engineering. This talk is the story of how Twilio got started with Chaos Engineering, lessons learned, and the impact to our engineering culture.
How to build simple web apps to automate your SEO tasks - BrightonSEO Spring ...Charly Wargnier
Time to speed-up your SEO workflows!
In this talk, I will show you how to:
+ Build simple Python Web apps to automate your tasks via the mighty Streamlit framework
+ Deploy them in one click and for free, so you can share them with your teammates (or the word!)
I'll finish the talk with some exciting use cases!
Media horita de funcionalidades y secciones del inspector de Chrome que se pueden usar para exprimir los análisis SEO de nuestros proyectos.
Recursos de interés:
https://developers.google.com/web/tools/chrome-devtools/
https://searchengineland.com/chromes-devtools-seo-10-ways-use-seo-audits-266433
https://www.onely.com/blog/chrome-developer-tools-overview/
https://trafficthinktank.com/google-chrome-technical-seo/
https://codeseo.io/google-chrome-seo-without-a-plugin/
https://www.reddoor.biz/blog/chrome-developer-tools-9-hacks-for-an-seo/
http://anti-code.com/devtools-cheatsheet/
https://code.tutsplus.com/articles/chrome-dev-tools-networking-and-the-console--net-28167
Similar to BrightonSEO April 2019 - Tom Pool - Chrome Puppeteer, Fake Googlebot & Monitor Your Site! (9)
Understanding Globus Data Transfers with NetSageGlobus
NetSage is an open privacy-aware network measurement, analysis, and visualization service designed to help end-users visualize and reason about large data transfers. NetSage traditionally has used a combination of passive measurements, including SNMP and flow data, as well as active measurements, mainly perfSONAR, to provide longitudinal network performance data visualization. It has been deployed by dozens of networks world wide, and is supported domestically by the Engagement and Performance Operations Center (EPOC), NSF #2328479. We have recently expanded the NetSage data sources to include logs for Globus data transfers, following the same privacy-preserving approach as for Flow data. Using the logs for the Texas Advanced Computing Center (TACC) as an example, this talk will walk through several different example use cases that NetSage can answer, including: Who is using Globus to share data with my institution, and what kind of performance are they able to achieve? How many transfers has Globus supported for us? Which sites are we sharing the most data with, and how is that changing over time? How is my site using Globus to move data internally, and what kind of performance do we see for those transfers? What percentage of data transfers at my institution used Globus, and how did the overall data transfer performance compare to the Globus users?
Unleash Unlimited Potential with One-Time Purchase
BoxLang is more than just a language; it's a community. By choosing a Visionary License, you're not just investing in your success, you're actively contributing to the ongoing development and support of BoxLang.
Custom Healthcare Software for Managing Chronic Conditions and Remote Patient...Mind IT Systems
Healthcare providers often struggle with the complexities of chronic conditions and remote patient monitoring, as each patient requires personalized care and ongoing monitoring. Off-the-shelf solutions may not meet these diverse needs, leading to inefficiencies and gaps in care. It’s here, custom healthcare software offers a tailored solution, ensuring improved care and effectiveness.
Software Engineering, Software Consulting, Tech Lead.
Spring Boot, Spring Cloud, Spring Core, Spring JDBC, Spring Security,
Spring Transaction, Spring MVC,
Log4j, REST/SOAP WEB-SERVICES.
Code reviews are vital for ensuring good code quality. They serve as one of our last lines of defense against bugs and subpar code reaching production.
Yet, they often turn into annoying tasks riddled with frustration, hostility, unclear feedback and lack of standards. How can we improve this crucial process?
In this session we will cover:
- The Art of Effective Code Reviews
- Streamlining the Review Process
- Elevating Reviews with Automated Tools
By the end of this presentation, you'll have the knowledge on how to organize and improve your code review proces
Listen to the keynote address and hear about the latest developments from Rachana Ananthakrishnan and Ian Foster who review the updates to the Globus Platform and Service, and the relevance of Globus to the scientific community as an automation platform to accelerate scientific discovery.
Large Language Models and the End of ProgrammingMatt Welsh
Talk by Matt Welsh at Craft Conference 2024 on the impact that Large Language Models will have on the future of software development. In this talk, I discuss the ways in which LLMs will impact the software industry, from replacing human software developers with AI, to replacing conventional software with models that perform reasoning, computation, and problem-solving.
Globus Compute wth IRI Workflows - GlobusWorld 2024Globus
As part of the DOE Integrated Research Infrastructure (IRI) program, NERSC at Lawrence Berkeley National Lab and ALCF at Argonne National Lab are working closely with General Atomics on accelerating the computing requirements of the DIII-D experiment. As part of the work the team is investigating ways to speedup the time to solution for many different parts of the DIII-D workflow including how they run jobs on HPC systems. One of these routes is looking at Globus Compute as a way to replace the current method for managing tasks and we describe a brief proof of concept showing how Globus Compute could help to schedule jobs and be a tool to connect compute at different facilities.
Cyaniclab : Software Development Agency Portfolio.pdfCyanic lab
CyanicLab, an offshore custom software development company based in Sweden,India, Finland, is your go-to partner for startup development and innovative web design solutions. Our expert team specializes in crafting cutting-edge software tailored to meet the unique needs of startups and established enterprises alike. From conceptualization to execution, we offer comprehensive services including web and mobile app development, UI/UX design, and ongoing software maintenance. Ready to elevate your business? Contact CyanicLab today and let us propel your vision to success with our top-notch IT solutions.
OpenFOAM solver for Helmholtz equation, helmholtzFoam / helmholtzBubbleFoamtakuyayamamoto1800
In this slide, we show the simulation example and the way to compile this solver.
In this solver, the Helmholtz equation can be solved by helmholtzFoam. Also, the Helmholtz equation with uniformly dispersed bubbles can be simulated by helmholtzBubbleFoam.
Top Features to Include in Your Winzo Clone App for Business Growth (4).pptxrickgrimesss22
Discover the essential features to incorporate in your Winzo clone app to boost business growth, enhance user engagement, and drive revenue. Learn how to create a compelling gaming experience that stands out in the competitive market.
Launch Your Streaming Platforms in MinutesRoshan Dwivedi
The claim of launching a streaming platform in minutes might be a bit of an exaggeration, but there are services that can significantly streamline the process. Here's a breakdown:
Pros of Speedy Streaming Platform Launch Services:
No coding required: These services often use drag-and-drop interfaces or pre-built templates, eliminating the need for programming knowledge.
Faster setup: Compared to building from scratch, these platforms can get you up and running much quicker.
All-in-one solutions: Many services offer features like content management systems (CMS), video players, and monetization tools, reducing the need for multiple integrations.
Things to Consider:
Limited customization: These platforms may offer less flexibility in design and functionality compared to custom-built solutions.
Scalability: As your audience grows, you might need to upgrade to a more robust platform or encounter limitations with the "quick launch" option.
Features: Carefully evaluate which features are included and if they meet your specific needs (e.g., live streaming, subscription options).
Examples of Services for Launching Streaming Platforms:
Muvi [muvi com]
Uscreen [usencreen tv]
Alternatives to Consider:
Existing Streaming platforms: Platforms like YouTube or Twitch might be suitable for basic streaming needs, though monetization options might be limited.
Custom Development: While more time-consuming, custom development offers the most control and flexibility for your platform.
Overall, launching a streaming platform in minutes might not be entirely realistic, but these services can significantly speed up the process compared to building from scratch. Carefully consider your needs and budget when choosing the best option for you.
May Marketo Masterclass, London MUG May 22 2024.pdfAdele Miller
Can't make Adobe Summit in Vegas? No sweat because the EMEA Marketo Engage Champions are coming to London to share their Summit sessions, insights and more!
This is a MUG with a twist you don't want to miss.
Check out the webinar slides to learn more about how XfilesPro transforms Salesforce document management by leveraging its world-class applications. For more details, please connect with sales@xfilespro.com
If you want to watch the on-demand webinar, please click here: https://www.xfilespro.com/webinars/salesforce-document-management-2-0-smarter-faster-better/
How Recreation Management Software Can Streamline Your Operations.pptxwottaspaceseo
Recreation management software streamlines operations by automating key tasks such as scheduling, registration, and payment processing, reducing manual workload and errors. It provides centralized management of facilities, classes, and events, ensuring efficient resource allocation and facility usage. The software offers user-friendly online portals for easy access to bookings and program information, enhancing customer experience. Real-time reporting and data analytics deliver insights into attendance and preferences, aiding in strategic decision-making. Additionally, effective communication tools keep participants and staff informed with timely updates. Overall, recreation management software enhances efficiency, improves service delivery, and boosts customer satisfaction.
Enterprise Resource Planning System includes various modules that reduce any business's workload. Additionally, it organizes the workflows, which drives towards enhancing productivity. Here are a detailed explanation of the ERP modules. Going through the points will help you understand how the software is changing the work dynamics.
To know more details here: https://blogs.nyggs.com/nyggs/enterprise-resource-planning-erp-system-modules/
Utilocate offers a comprehensive solution for locate ticket management by automating and streamlining the entire process. By integrating with Geospatial Information Systems (GIS), it provides accurate mapping and visualization of utility locations, enhancing decision-making and reducing the risk of errors. The system's advanced data analytics tools help identify trends, predict potential issues, and optimize resource allocation, making the locate ticket management process smarter and more efficient. Additionally, automated ticket management ensures consistency and reduces human error, while real-time notifications keep all relevant personnel informed and ready to respond promptly.
The system's ability to streamline workflows and automate ticket routing significantly reduces the time taken to process each ticket, making the process faster and more efficient. Mobile access allows field technicians to update ticket information on the go, ensuring that the latest information is always available and accelerating the locate process. Overall, Utilocate not only enhances the efficiency and accuracy of locate ticket management but also improves safety by minimizing the risk of utility damage through precise and timely locates.
Like many of us, I’m constantly trying to find any new ways to make my (and my teams) jobs easier
So this awesome guy - Eric Bidelman - is a software engineer at Google, and works on headless chrome, lighthouse & dev tools.
I can use chrome puppeteer to help me with my job
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So I went away and did a literal shit ton of research, that is worth sharing.
So, the first thing i was looking for was a basic definition.
Contrary to what i wanted to believe, it did not involve any decapitation
So when you open up Google Chrome normally, you get a wonderful User Interface with bookmarks
And a search bar, plugins, buttons, tabs
And usable functionality.
With headless chrome, you get none of that shit.
So here I am running headless chrome
And we can see that it is in the background, but I have no Chrome windows open.
So Google Chrome is Running, but with NO User Interface.
SO it is running without the UX/UI head
Why should you even care about this sort of stuff though?
Through this research journey, I found out that you can do a bunch of stuff with it!
Scrape the literal shit out of Javascript websites (as well as basic HTML scraping)
You can copy the DOM, and then paste it into a text file, with which you canm
Compare the source code of the site with the DOM, and then export differences. This can allow you to identify any potential rendering issues.
Can use it to generate screenshots of
And effectively crawl single page applications
JS Can be a bit of a pain to work with, but unfortunately, it is not going away!
So Screaming Frog (and a majority of crawling softwares), utilise something like headless chrome to emulate a browser, and provide JS rendering features.
And we all know about issues that Google can have with crawling JS, ranging from having slight issues with rendering, to completely drawing a blank.
So there have been a bunch of JS indexing and rendering case studies over the past couple of years.
So it can help you crawl these guys.
We can also use Headless Chrome to automate web page checks, and I provide an in depth investigation to this later on in this deck.
AND it can be used for general webpage testing. Including clicking on stuff, filling in forms, general fuckery with the mouse and keyboard.
It is really good for emulating user behaviour. So great for pretending to be a user, and browsing around a site.
SO it is basically really great for seeing exactly how much shit a website can take before it breaks!
However, the problem with running all of these tasks is
You have to run basic headless chrome through the command line interface
So first you gotta install some dependencies, and have a shit ton of errors hit you in the face, and you gotta know where chrome is stored on your local machine...
Then you gotta run directly from that location
Then specify headless chrome to launch
Then open a port to use
Then you gotta disable GPU
Then you can add a single URL, or a URL list into the command line
Now then
I really really really love using command line
In fact so much so that I spoke about it at Brighton last year
But doing all of this shit really really really really made me wanna cry
So how do I make utilsiing headless chrome, which is freaking awesome - easy?
Like I said a few minutes ago, I’m always trying to find ways to make my job easier
And doing all of these boring ass steps was really really not easy. At All.
So I went away and did a bigger shit ton of research.
So, in this talk at Google IO, Eric mentions something called Google Puppeteer ()shoutout eric
So what is Chrome Puppeteer?
Doing a simple Google Search for Chrome Puppeteer reveals all.
But the stuff I’m interested in is this. A Node Library, and
Oooooooooo an API
So Node - for those that do not have dev experience, can be used for making some pretty kick-ass applications
It can also be used to help control headless chrome in an easy to digest and utilise package
So Node - for those that do not have dev experience, can be used for making some pretty kick-ass applications
So how can you actually get chrome pupppeteer?
If you want to run tests on your local machine, you have to install a few things first.
Node.js - which is a runtime environment, and NPM which is a package manager for node.
Chill out though, it’s fairly straightforward
Someone a while ago has made this easy
So If you are on PC it’s fairly simple to get and install,
You’ve just gotta install these things from the Node JS website
I’ve linked to a guide here - that takes you through step by step.
If, like me, you are on a Mac
If, like me, you are on a Mac
Its not that easy.
There’s a wicked awesome guide here that takes you through step by step what you need to do.
So you wanna start off by opening up terminal
And then typing in a few lines of shit
This installs homebrew, that makes everything even ez-er
This installs homebrew, that makes everything even ez-er
This installs homebrew, that makes everything even ez-er
So when homebrew is downloaded - it shouldnt take too long - a max of 5 mins
So You Have To Install 2 More Things, And We’ll Be Ready To Rock. These are npm and node.
So just type in this. It installs node through homebrew, directly onto your machine with no fuckery.
So this installs node and npm, you’ll get a nice progress bar tellling you how far along it is
Then you wanna use npm to install the latest version of puppeteer.
Now that’s it, you are all good and groovy!
You can
So for example.
If I wanted to take a screenshotof a single page
So just type in this, and you should be good to go.
So just type in this, and you should be good to go.
So just type in this, and you should be good to go.
You’ll need to code some stuff up - but I’ve put everything together into a single google doc, that makes it simple & easy to understand what each bit does. Exmplain that you are going to go through it.
So we are starting up a headless browser, in true headless mode, so you won’t see what goes on (running in the background)
And then we are opening up a new tab/page
And then we specify exactly what URL we want to go to. So in this instance, we are testing the BlueArray Hoempage
Then we are taking a screenshot. We have to specify 2 things to allow the code to work correctly
So the path, so where and what we want the file to be saved as
And then saving as a specific filetype. Can fuck around with this, and get the ideal filetype that is good for you.
And then we close the page, and then close the broswer.
And then we close the page, and then close the broswer.
Go to terminal, make sure you are in the same folder as your code, and type in
Go to terminal, make sure you are in the same folder as your code, and type in
Node screenshot.js.
And then a couple of seconds later, you’ll see
A nice screenshot get added to your folder with your code in
If you wanted to see the browser test this exactly for you,
Just change the headless mode to false. This is great for seeing exactly what the browser sees, and looks pretty cool, having a chrome window doing all sorts of shit in front of you!
Just change the headless mode to false. This is great for seeing exactly what the browser sees, and looks pretty cool, having a chrome window doing all sorts of shit in front of you!
You can also modify the script slightly to run through a list of provided URLs
And then get a bunch of screenshots!
Now I’m sure that you guys can see where this is headed
Faking Googlebot and seeing what they would see
So with a few little tweaks to the code that we have for the first example
Adding in a user agent string, and setting it to what Googlebot use
FYI Googlebot user agent string is not ‘Googlebot’ it is fucking massive
FYI Googlebot user agent string is not ‘Googlebot’ it is fuckinhg massive
And wouldn’t fit on the slide
Node screenshot.js. Screenshot.js is the name of the file.
Using the await page set viewport option
So we have to specify the width and the height of the viewport that we want to use
This isn’t reallt Googlebot, just a decent attempt at emulation
AS unfortunately
As puppeteer was launched way after Chrome 41, we cannot specify it to use this version of Chrome :*(
As puppeteer was launched way after Chrome 41, we cannot specify it to use this version of Chrome :*(
However
This can be persuasive in getting a client to ensure that their content is Rendered Server Side, as opposed to client side, if needed
This can be persuasive in getting a client to ensure that their content is Rendered Server Side, as opposed to client side, if needed
We can then provide a list of URLs that we want to get screenshotted
And show how they would appear to Google through puppeteer rendering, instead of
In the case of some rather shit JS sites
Absolutely fuck all
Nothing - a blank page
Which is pretty cool, and allows for bulk page testing
But the really cool stuff is yet to come!
So who here has heard of, or even used Content King?
It’s a fairly awesome piece of software
That allows you to monitor a site in -real time ish,
With it alerting you of any issues such as
Meta data changes, New pages that 404, Updated links, redirects, indexable and non-indexable pages….
However!
Like most really good tools, it costs money
Maybe You Don’t Wanna Eat Into Your Budget For Content King for a personal project site, or you don’t need the level of detail that those guys provide for a smaller, shitter site?
This Next Example Shows How We Can Use puppeteer to
Monitor a chosen site when you want, and report of any changes to key areas
Including some key areas, such as
Meta title changes
Meta description updates
Any increase or decrease in the word count of the page.
Pull out any robots directives, and highlights any differences between them
Any differences in canonical elements
So basically the really important shit from a HTML webpage
So I wrote some code
So I’ll be tweeting this out after for those who are interested..
As with all coding, this required a bit of research
Ahem stackoverflow ahem
And with a little bit of luck
We now have a way to monitor these basic areas for web pages
This is how it works
There is about 200 lines of code in total
Heres a small snapshot
An i don’t have time to go through the full thing today,
but
There are a few really interesting snippets that I’d really like to share, that can come in handy
So we launch headless chrome as highlighted a few minutes ago
Like so. So we launch the browser, and then create a new page within the browser, awaiting for further instruction...
And then we provide a list of URLs for Puppeteer to go and fuck around with
So here we are quoting the file that we will use for this program, we parse (or read it) using a couple more lines, that don’t really look that exciting!
And then we pull in teh relevant meta data that I mentioned
SO, for example
Gonna show you guys how we pull in meta titles
So we are just pulling the title from the page. If there isn’t one - we get an error, so add in this - n/a
And then create an array of all the meta data - so a nice, formatted list of data that we can use later on within the script
So this just tells the script to treat all this data as one line, that we can then refer back to later
And we then pushed all this data to a text file
The Script then loops through every URL that is provided, pullingout all data for each
It then checks for differences in the data - so compares this run with the previous one.
If there are any differences between the two sets of data, these get saved within a changes.txt file
That i can then check whenever
So I can see what has changed from yesterday, or whenever I last ran the code
This required me to run the code each day manually
That I completely forgot to do
So, I went one step further, to make my life even easier
Chucked the code on a Raspberry Pi
And set up a cron job within my local machine to automatically run the script at the same time
Every day
And then
This was the bit that took the most amount of time by faarrr