Seo fixes

config/last_updated.json

@@ -1,132 +1,127 @@
 {
   "/static/css/bootstrap.min.css": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "ec3bb52a00e176a7181d454dffaea219"
   },
   "/static/css/index.css": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "c9d02fdf5e2bbd380b09217a13e72b72"
   },
   "/static/css/report.css": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "a35ccc6dd3249e1cb741ba52f8648fba"
   },
   "/static/css/reports.css": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "f6c0204af5b5e600573fa356a5bdb177"
   },
   "/static/css/styles.css": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "a03dbabed734fa1c959db7ab60edce5c"
   },
   "/static/js/faq.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "14ba894ead819c322cf8a67e9d01dbff"
   },
   "/static/js/histogram.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "804469446aa0cff5aaab9c29b270c3da"
   },
   "/static/js/index.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "e2b398737bf92ae635be1f606d455d16"
   },
   "/static/js/main.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "36da1f8970107c2d3feb46fa51f5e9f0"
   },
   "/static/js/report.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "66d2e6fcafe639dc80e5e05745468a8a"
   },
   "/static/js/timeseries.js": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-24T00:00:00.000Z",
     "hash": "0dffeb46e328a59a696fbd200b1e47ec"
   },
   "about.html": {
-    "date_published": "2021-04-23T00:00:00.000Z",
-    "date_modified": "2021-04-24T00:00:00.000Z",
-    "hash": "190e748a7c108dd6ca2748e7bc20652e"
+      "date_published": "2018-05-08T00:00:00.000Z",
+    "date_modified": "2021-04-25T00:00:00.000Z",
+    "hash": "00c84f7863c4b00966585d1826e876ed"
   },
   "faq.html": {
-    "date_published": "2021-04-23T00:00:00.000Z",
-    "date_modified": "2021-04-24T00:00:00.000Z",
-    "hash": "ca5e733b80090921af16402617aeaa2f"
+      "date_published": "2018-05-08T00:00:00.000Z",
+    "date_modified": "2021-04-25T00:00:00.000Z",
+    "hash": "1bc337565f9dca27f5d115ef3e5d6ab4"
   },
   "index.html": {
-    "date_published": "2021-04-23T00:00:00.000Z",
-    "date_modified": "2021-04-24T00:00:00.000Z",
-    "hash": "db83e15d5e15c7e4b4a41de9010b031a"
-  },
-  "main.html": {
-    "date_published": "2021-04-23T00:00:00.000Z",
-    "date_modified": "2021-04-24T00:00:00.000Z",
-    "hash": "d5c8fe3e769e1d677cb0210c653eeac9"
+      "date_published": "2018-05-08T00:00:00.000Z",
+    "date_modified": "2021-04-25T00:00:00.000Z",
+    "hash": "17eba4c6a92c305ea3170e33a7530fd8"
   },
   "reports.html": {
-    "date_published": "2021-04-23T00:00:00.000Z",
-    "date_modified": "2021-04-24T00:00:00.000Z",
-    "hash": "423630c50cd3977fdeed91747cd93124"
+      "date_published": "2018-05-08T00:00:00.000Z",
+    "date_modified": "2021-04-25T00:00:00.000Z",
+    "hash": "a570334ab624785fe12e2b387ef420f4"
   },
   "reports/accessibility": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "942d0d92d36501186349cd3b0866d5b2"
   },
   "reports/chrome-ux-report": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "9ef5833114e90b95c43aedfdadeec02d"
   },
   "reports/loading-speed": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "133dab1f1b207e4ed70243cb42526576"
   },
   "reports/page-weight": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "b0f8af74a38c8afb27a07cfcf8d6cc26"
   },
   "reports/progressive-web-apps": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "1423e1ac221866cd1d664ca8bf20d2a7"
   },
   "reports/project-fugu": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+    "date_published": "2020-07-31T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "66c919b24eba7647f5cfb81e6d01f13e"
   },
   "reports/search-engine-optimization": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "3ea330c0ebfb6d17c76baa45928db117"
   },
   "reports/state-of-images": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "3e4226bd3a208a4e6e8f57d2cf9ae62d"
   },
   "reports/state-of-javascript": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "d2e2b3b64d6f0b0b285828b69b738217"
   },
   "reports/state-of-the-web": {
-    "date_published": "2021-04-23T00:00:00.000Z",
+      "date_published": "2018-05-08T00:00:00.000Z",
     "date_modified": "2021-04-23T00:00:00.000Z",
     "hash": "c00b2a6f221ea99bbc53817108250182"
   }
-}
+}

config/reports.json

@@ -923,6 +923,7 @@
   "state-of-javascript": {
     "name": "State of JavaScript",
     "summary": "JavaScript powers the modern web, enabling rich and interactive web applications. In this report we dive into how JavaScript is used on the web, and its adoption and trends both for mobile and desktop experiences.",
+    "image": "/static/img/reports/state-of-javascript-report.png",
     "metrics": [
       "bytesJs",
       "reqJs",
@@ -944,6 +945,7 @@
   "loading-speed": {
     "name": "Loading Speed",
     "summary": "Web performance can directly impact business metrics like conversion and user happiness. This report analyzes various performance metrics in the lifecycle of a loading page including those used by many modern progressive web apps.",
+    "image": "/static/img/reports/loading-speed-report.png",
     "metrics": [
       "fcp",
       "ttci",
@@ -963,6 +965,7 @@
   "state-of-the-web": {
     "name": "State of the Web",
     "summary": "This report captures a long view of the web, including the adoption of techniques for efficient network utilization and usage of web standards like HTTPS.",
+    "image": "/static/img/reports/state-of-the-web-report.png",
     "metrics": [
       "numUrls",
       "bytesTotal",
@@ -985,6 +988,7 @@
   "search-engine-optimization": {
     "name": "SEO",
     "summary": "How websites are built can affect their ranking in search results. This report tracks the adoption of several key Search Engine Optimization (SEO) techniques.",
+    "image": "/static/img/reports/search-engine-optimization-report.png",
     "metrics": [
       "canonical",
       "hreflang",
@@ -1006,6 +1010,7 @@
   "page-weight": {
     "name": "Page Weight",
     "summary": "This report tracks the size and quantity of many popular web page resources. Sizes represent the number of bytes sent over the network, which may be compressed.",
+    "image": "/static/img/reports/page-weight-report.png",
     "metrics": [
       "bytesTotal",
       "reqTotal",
@@ -1035,6 +1040,7 @@
   "chrome-ux-report": {
     "name": "Chrome User Experience Report",
     "summary": "Loading and interactivity performance as experienced by real-world Chrome users across a diverse set of hardware and network conditions, powered by the [Chrome User Experience Report](https://developers.google.com/web/tools/chrome-user-experience-report/).",
+    "image": "/static/img/reports/chrome-user-experience-report.png",
     "metrics": [
       "cruxFp",
       "cruxFcp",
@@ -1067,6 +1073,7 @@
   "progressive-web-apps": {
     "name": "Progressive Web Apps",
     "summary": "This report examines the state of [Progressive Web Apps](https://developers.google.com/web/progressive-web-apps/) (PWAs). PWAs are a new class of web applications, enabled by the [Service Worker APIs](https://developer.mozilla.org/en/docs/Web/API/Service_Worker_API). Service workers allow apps to support network-independent loading, to receive push notifications as well as to synchronize data in the background, and — together with [Web App Manifests](https://developer.mozilla.org/en-US/docs/Web/Manifest) — allow users to install PWAs.",
+    "image": "/static/img/reports/progressive-web-apps-report.png",
     "metrics": [
       "pwaScores",
       "swControlledPages"
@@ -1086,6 +1093,7 @@
   "accessibility": {
     "name": "Accessibility",
     "summary": "This report tracks accessibility of pages as measured by [Lighthouse](https://developers.google.com/web/tools/lighthouse/). Metrics in this report are only available for mobile.",
+    "image": "/static/img/reports/accessibility-report.png",
     "metrics": [
       "a11yScores",
       "a11yButtonName",
@@ -1109,6 +1117,7 @@
   "project-fugu": {
     "name": "Capabilities",
     "summary": "The [Capabilities Project](https://web.dev/fugu-status/) (aka. Project Fugu 🐡) is a cross-company effort at Google to make it possible for web apps to do anything native apps can, by exposing the capabilities of the operating system platform to the web platform, while maintaining user security, privacy, trust, and other core tenets of the web.",
+    "image": "/static/img/reports/capabilities-report.png",
     "metrics": [
       "asyncClipboardRead",
       "badgeSet",

main.py

@@ -27,18 +27,56 @@
 import faq as faq_util
 from legacy import Legacy
 
-from flask import Flask, request, make_response, jsonify, render_template, redirect, \
-                  abort, url_for as flask_url_for, send_from_directory
+from flask import Flask, request, make_response, jsonify, render_template as flask_render_template, \
+                  redirect, abort, url_for as flask_url_for, send_from_directory
 from flaskext.markdown import Markdown
 from flask_talisman import Talisman
+import json
+import datetime
 
 
+logging.basicConfig(level=logging.DEBUG)
+
 app = Flask(__name__)
 Markdown(app)
 talisman = Talisman(app,
                     content_security_policy=csp,
                     content_security_policy_nonce_in=['script-src'])
 legacy_util = Legacy(faq_util)
+timestamps_json = {}
+
+
+def update_config():
+    global timestamps_json
+    with open('config/last_updated.json', 'r') as config_file:
+        timestamps_json = json.load(config_file)
+    return
+
+
+def get_timestamps_config():
+    global timestamps_json
+    return timestamps_json
+
+
+def get_file_date_info(file, type):
+    timestamps_config = get_timestamps_config()
+    # Default Published and Last Updated to today
+    today = datetime.datetime.utcnow().isoformat()
+    if type == 'date_published' or type == 'date_modified':
+        return timestamps_config.get(file, {}).get(type, today)
+    else:
+        return timestamps_config.get(file, {}).get(type)
+
+
+# Overwrite the built-in method.
+def render_template(template, *args, **kwargs):
+
+    date_published = get_file_date_info(template, "date_published")
+    date_modified = get_file_date_info(template, "date_modified")
+
+    kwargs.update(date_published=date_published,
+                  date_modified=date_modified)
+    return flask_render_template(template, *args, **kwargs)
 
 
 # Overwrite the built-in method.
@@ -312,15 +350,20 @@ def sitemap():
     # This is used when running locally. Gunicorn is used to run the
     # application on Google App Engine. See entrypoint in app.yaml.
 
+    update_config()
+    report_util.get_reports()
+
     # If the 'background' command line argument is given:
     #    python main.py background &
     # then run in non-debug mode, as debug mode can't be backgrounded
     # but debug mode is useful in general (as auto reloads on change)
     if len(sys.argv) > 1 and sys.argv[1] == 'background':
+        logging.debug('Running in background mode')
         # Turn off HTTPS redirects (automatically turned off for debug)
         talisman.force_https = False
         app.run(host='0.0.0.0', port=8080)
     else:
+        logging.debug('Running in debug mode')
         app.run(host='0.0.0.0', port=8080, debug=True)
 
 # [END app]

package.json

@@ -21,7 +21,8 @@
     "start:darwin:linux": "./tools/scripts/run_and_test_website.sh -d",
     "start:win32": "call tools/scripts/run_and_test_website.bat",
     "stage": "npm run build && echo \"Y\" | gcloud app deploy --project httparchive-staging --stop-previous-version",
-    "deploy": "npm run build && npm run timestamp && npm run generate && echo \"Y\" | gcloud app deploy --project httparchive --stop-previous-version",
+    "testdeploy": "npm run build && npm run timestamps && npm run generate && echo \"Y\" | gcloud app deploy --project httparchive --no-promote",
+    "deploy": "npm run build && npm run timestamps && npm run generate && echo \"Y\" | gcloud app deploy --project httparchive --stop-previous-version",
     "timestamps": "node ./tools/generate/generate_timestamps",
     "lint": "run-script-os",
     "lint:darwin:linux": "docker container run -it --rm -v \"$PWD\":/app -w /app --entrypoint=./tools/scripts/run_linter_locally.sh github/super-linter",

static/css/index.css

@@ -34,16 +34,30 @@
   margin-bottom: 7px;
 }
 
+.blog-post-tags {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
 .blog-post-tag {
   margin-right: 10px;
+  padding-top: 10px;
+  padding-bottom: 10px;
 }
 
 .blog-post-tag:last-child {
   margin-right: 0;
 }
 
+.blog-post-reactions {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
 .blog-post-reaction {
   margin-right: 20px;
+  padding-top: 10px;
+  padding-bottom: 10px;
 }
 
 .blog-post-reaction img {
@@ -63,7 +77,7 @@
 }
 
 #discussion-table th {
-  color: #81c8c1;
+  color: #444;
   text-align: center;
 }
 

static/css/report.css

@@ -77,7 +77,7 @@
 }
 
 #TOC a {
-  color: #3174ae;
+  color: #444;
 }
 
 .metric-summaries {
@@ -174,6 +174,10 @@ th {
   margin: 0 auto;
 }
 
+.highcharts-range-selector {
+  display: none;
+}
+
 .highcharts-contextbutton {
   color: red;
 }