GoogleChrome/lighthouse 20442
Automated auditing, performance metrics, and best practices for the web.
gitpoint/git-point 4434
GitHub in your pocket :iphone:
housseindjirdeh/angular2-hn 1289
:boom: Progressive Hacker News client built with Angular
GoogleChromeLabs/progressive-tooling 491
A list of community-built, third-party tools that can be used to improve page performance
GoogleChrome/lighthouse-stack-packs 135
Lighthouse Stack Packs
GoogleChromeLabs/perf-track 93
Tracking framework performance and usage at scale
GoogleChromeLabs/go-hackernews 82
A Hacker News client written in Go
housseindjirdeh/angular2-redux-contact-list 60
:clipboard: Contact list built with Angular 2, Immutable.js and Redux
Website
GoogleChromeLabs/tour-of-thrones 7
A Game of Thrones app built with Angular
starteddevelopit/microbundle
started time in 16 days
issue openedvercel/next.js
Next.js-hydration performance measure is under-counting actual hydration time
Bug report
Describe the bug
Next.js-hydration performance measure is under-counting actual hydration time
To Reproduce
Steps to reproduce the behavior, please provide code snippets or a repository:
- Go to https://www.fairprice.com.sg/
- Open Chrome DevTools --> Performance
- Measure hydration and look for the
Next.js-hydrationperformance measure - Notice how the performance measure is shorter than the actual hydrate period

Additional context
I'll take a look into this and fix it :)
created time in 18 days
issue commentvercel/next.js
Ability to opt-out of `web-vitals` package that's currently bundled with Next.js
Although it's tiny, I agree it's an additional cost if you're not using it to measure metrics at all.
I wouldn't mind if we keep it included by default and have a flag to opt-out. @timneutkens do you agree?
comment created time in 18 days
push eventGoogleChrome/lighthouse-stack-packs
commit sha 80f21531e54fd7a36d4cc2a9028f78b6172b7829
Update joomla.js
commit sha 597a861ed0ca2f276e9e8c04e1de0b58d2253d71
Merge pull request #46 from zero-24/patch-1 [Joomla] Make sure we mention the Joomla 4 lazy load plugin.
push time in a month
PR merged GoogleChrome/lighthouse-stack-packs
The joomla 4.x core sets the loading attribute native. In some cases (old content) it might be nessesary to enable that plugin from the core so lets mention it here.
pr closed time in a month
pull request commentGoogleChromeLabs/perf-track
Thanks for this @PraveenPal4232!
There's the small issue of larger screen sizes, where an "auto" height doesn't fill out the page:

We may have to use a combination of min-height: 100% and then ensure the inner containers + grid items fit the size of the screen.
comment created time in a month
Pull request review commentGoogleChrome/web.dev
Updates to native lazy-loading guide
Images that are defined using the `<picture>` element can also be lazy-loaded: Although a browser will decide which image to load from any of the `<source>` elements, the `loading` attribute only needs to be included to the fallback `<img>` element.+ +## Avoid lazy-loading images that are in the first visible viewport -### iframe loading+You should avoid setting `loading=lazy` for any images that are in the first visible viewport. -The `loading` attribute affects iframes differently than images, depending on whether the iframe is-hidden. (Hidden iframes are often used for analytics or communication purposes.) Chrome uses the-following criteria to determine whether an iframe is hidden:+It is recommended to only add `loading=lazy` to images which are positioned below the fold, if possible. Images that are eagerly loaded can be fetched right away, while images which are loaded lazily the browser currently needs to wait until it knows where the image is positioned on the page, which relies on the IntersectionObserver to be available. -- The iframe's width and height are 4 px or smaller.-- `display: none` or `visibility: hidden` is applied.-- The iframe is placed off-screen using negative X or Y positioning.+{% Aside %}+ In Chromium, the impact of images in the initial viewport being marked with `loading=lazy` on Largest Contentful Paint is fairly small, with a regression of <1% at the 75th and 99th percentiles compared to eagerly loaded images.+{% endAside %} -If an iframe meets any of these conditions, Chrome considers it hidden and won't lazy-load it in-most cases. Iframes that _aren't_ hidden will only load when they're within the [load-in distance threshold](#load-in-distance-threshold).-A placeholder shows for lazy-loaded iframes that are still being fetched.+Generally, any images within the viewport should be loaded eagerly using the browser's defaults. You do not need to specify `loading=eager` for this to be the case for in-viewport images.+ +```html+<!-- visible in the viewport -->+<img src="product-1.jpg" alt="..." width="200" height="200">+<img src="product-2.jpg" alt="..." width="200" height="200">+<img src="product-3.jpg" alt="..." width="200" height="200">+ +<!-- offscreen images -->+<img src="product-4.jpg" loading="lazy" alt="..." width="200" height="200">+<img src="product-5.jpg" loading="lazy" alt="..." width="200" height="200">+<img src="product-6.jpg" loading="lazy" alt="..." width="200" height="200">+```++## Graceful degredation ++Browsers that do not yet support the `loading` attribute will ignore its presence. While these browsers will of course not get the benefits of lazy-loading, including the attribute has no negative impact on them. ## FAQ -### Are there plans to expand this feature?+### Are there plans to automatically lazy-load images in Chrome? -There are plans to change the default lazy-loading behavior of the browser to automatically-lazy-load any images or iframes that are well suited to being deferred if [Lite-mode](https://blog.chromium.org/2019/04/data-saver-is-now-lite-mode.html) is enabled on Chrome for-Android.+Chromium already automatically+lazy-load any images that are well suited to being deferred if [Lite
lazy-loads any images that are well suited to being deferred if [Lite
comment created time in a month
Pull request review commentGoogleChrome/web.dev
Updates to native lazy-loading guide
the meantime, you will need to override the effective connection type of the bro `chrome://flags/#force-effective-connection-type` flag. {% endAside %} -### Image loading -To prevent the surrounding content from reflowing when a lazy-loaded image is downloaded, make sure-to add `height` and `width` attributes to the `<img>` element or specify their values directly in an-inline style:+### Images should include dimension attributes++While the browser loads an image, it does not immediately know the image's dimensions, unless these are explicitly specified. To enable the browser to reserve sufficient space on a page for images, it is recommended that all `<img>` tags include both `width` and `height` attributes. Without dimensions specified, [layout shifts](/cls) can occur, which are more noticeable on pages that take some time to load. ```html-<img src="…" loading="lazy" alt="…" width="200" height="200">-<img src="…" loading="lazy" alt="…" style="height:200px; width:200px;">-<!-- lazy-loaded -->+<img src="image.png" loading="lazy" alt="…" width="200" height="200"> ``` -Images will still lazy-load if dimensions are not included, but [specifying them decreases the chance of-browser reflow](https://www.youtube.com/watch?v=4-d_SoCHeWE).+Alternatively, specify their values directly in an inline style:++```html+<img src="image.png" loading="lazy" alt="…" style="height:200px; width:200px;">+```++The best practice of setting dimensions applies to `<img>` tags regardless of whether or not they are being loaded lazily. With lazy-loading, this can become more relevant. Setting `width` and `height` on images in modern browsers also allows browsers to infer their instrinsic size.++Images will still lazy-load if dimensions are not included, but [specifying them decreases the chance of layout shift](https://www.youtube.com/watch?v=4-d_SoCHeWE). If you are unable to include dimensions for your images, lazy-loading them can be a trade-off between saving network resources and potentially being more at risk of layout shift. ++While native lazy-loading in Chromium is implemented in a way such that images are likely to be loaded once they are visible, it should be kept in mind, there is a slightly greater chance of them not being loaded yet. In this case, case missing `width` and `height` attributes on such images increase their impact on Cumulative Layout Shift.
While native lazy-loading in Chromium is implemented in a way such that images are likely to be loaded once they are visible, it should be kept in mind, there is a slightly greater chance of them not being loaded yet. In this case, missing `width` and `height` attributes on such images increase their impact on Cumulative Layout Shift.
comment created time in a month
PR opened johnmichel/Library-Detector-for-Chrome
Per @developit's suggestion of checking for CRA's specific <noscript> text and a React root.
This is probably the easiest way to detect CRA without fetching for certain files!
pr created time in a month
create barnchhousseindjirdeh/Library-Detector-for-Chrome
branch : add-new-cra-detection
created branch time in a month
issue commentGoogleChromeLabs/perf-track
Having aggregated LH performance scores (across percentiles p50, p75 and p95 too) would be a great addition, and should be possible to get through HTTP Archive crawls!
I think this will be a great addition, thanks for suggesting 🙏
comment created time in a month
issue commentGoogleChromeLabs/perf-track
Thanks for logging this @PraveenPal4232 :)
So this should have been resolved by #, but I most probably fiddled around with the container heights after that causing it to overflow on certain screens 😅
comment created time in a month
issue commentGoogleChromeLabs/perf-track
Show the framework name on hover of logos
That would be awesome @pajaydev, thank you!
It could be something like this:

Or it could look very much like the tooltip already used for the metric charts (can copy/reuse the same styles but just make it dark and center it for example):

Open to ideas too!
comment created time in a month
issue openedGoogleChromeLabs/perf-track
Show a list of URLs for each query analysis
It would be nice to allow anyone to click and see a list of all URLs for each part of the dashboard. For example: X% of Framework Y sites compress with Brotli --> Click somewhere and get a list of them.
Not sure what the easiest way this could be done. Linking to separate Google Sheets is one way, but that might get unwieldy 🤔
created time in a month
issue closedGoogleChromeLabs/perf-track
- [X] Use latest results from HTTP Archive/CrUX
- [X] Include more Web Vital metrics and surface them better
- [X] Largest Contenful Paint
- [X] Cumulative Layout Shift
- [X] First Input Delay
- [X] Clean things up
- [X] Improve design/clean up styles
- [X] Update README
- [X] Make mobile responsive
- [X] Add analytics
Nice to haves:
- [ ] Use BigQuery API to fetch data instead of local JSON files
- [ ] Add a few more technologies:
- [ ] Lit
- [X] Ember
- [X] Preact
- [X] AMP
- [ ] Compare SSR versus CSR sites for any of the frameworks
- (different toggles to switch between SSR/CSR)
- [ ] Include CMSs (Shopify, Magento, WordPress, etc...)
- [ ] Switch to a lighter charting lib
- [ ] Versioning support
closed time in a month
housseindjirdehissue commentGoogleChromeLabs/perf-track
Show the framework name on hover of logos
Great idea, a small tooltip could work :)
comment created time in a month
pull request commentjohnmichel/Library-Detector-for-Chrome
Thanks @developit! I've been staying away from only using their specific noscript tag but if we couple that with a React root I think that could be pretty fool-proof to a degree :)
@johnmichel What do you think? If you're okay with it, I'll put up a PR and bump to a new major version!
comment created time in a month
push eventjohnmichel/Library-Detector-for-Chrome
commit sha e7e5260d9ceb6a546b024ac053f2d91fdb94cc48
Improve preact detection performance
commit sha 3cc75ca845c1bc2ddea278655dd831bc138e8178
Merge pull request #173 from developit/patch-6 Improve preact detection performance
push time in a month
PR merged johnmichel/Library-Detector-for-Chrome
The fast path test for Preact wasn't detecting Preact X, which most sites are now using. This adds it, reports the version correctly, and hopefully avoids hitting the slow path in most cases.
pr closed time in a month
push eventjohnmichel/Library-Detector-for-Chrome
commit sha 4960702ff4b2018b01b51936dba999960236ab3a
[FEATURE] Add TYPO3 CMS as a library
commit sha aba43a81015cc61cd5076a4c163fbd3b780988fb
Update library/libraries.js Co-authored-by: Houssein Djirdeh <[email protected]>
commit sha 482d241022881ebd2d1360ae357c467db371f5f3
Merge pull request #171 from bmack/master Add detection for TYPO3
push time in a month
PR merged johnmichel/Library-Detector-for-Chrome
TYPO3 is a PHP-based open-source content management system. This change adds a detection for this system.
pr closed time in a month
issue commentGoogleChromeLabs/perf-track
Comparison for websites that don't use a JS framework
Great idea :)
So there's two potential options here:
- Add a section for all sites (entire dataset)
- Add a section for all sites that don't use a specific list of frameworks
Do you have a particular preference? Sounds like you're leaning towards number 2 and so am I. We wouldn't be able to objectively say no framework however, but at least provide data on all sites that don't use any of the most popular (React, Angular, Vue, Ember, AMP, Polymer)
comment created time in a month
push eventGoogleChromeLabs/perf-track
commit sha 08fbb41b653114745919acc71bbec1542b3ac19d
fix dataset references
push time in a month
push eventGoogleChromeLabs/perf-track
commit sha 9949e6bbe1bdc30dd4fcb78d88b027b385fc9f98
fix analytics + minor style updates
push time in a month
push eventGoogleChromeLabs/perf-track
commit sha a88400df3caf999b3c973d8c9462832f3d7e5867
fix analytics + minor style updates
push time in a month
push eventGoogleChromeLabs/perf-track
commit sha 04307ea3c80e32fc0b2aff6c1a5882fa9d5fa9da
fix analytics + minor style updates
push time in a month
push eventGoogleChromeLabs/perf-track
commit sha 448b33243a2ec3aa303fd64580f44fa64e551cdd
remove images from gitignore
commit sha 4962e848408d42b0b4e13adfb9b7a022206eaf5e
remove nonexistent analytics file script
commit sha 5e9d7fce2afe35a6c42e08b6700220ce1001774c
compress images
push time in a month
push eventGoogleChromeLabs/perf-track
commit sha 0f06c38256dcd5eb9c42c6bfb33bee33bd2edf2f
adds april dataset, other changes
commit sha 69eb1cf4ce797eb6d529b6e94f98ab83729db68e
a lil salt and pepper
commit sha c7da1c3c5d1302280fb6b0ac6d1c224387836d81
Merge pull request #10 from GoogleChromeLabs/final-updates Final updates
push time in a month
PR merged GoogleChromeLabs/perf-track
Finishing touches
pr closed time in a month
push eventGoogleChromeLabs/perf-track
commit sha f9ce65627eb3bb4e8be5d3a600c62882e362f76d
Fix layout issue The natural height of the container could be larger than 100% of the viewport height, causing it to overflow and overlap with the footer text. This change allows the container to grow to its natural height if needed, and push the footer below it to avoid the overlap.
commit sha c16b2d7cc18a2495c36d11668f1607116b382594
Merge pull request #7 from rviscomi/patch-1 Fix layout issue
push time in a month
PR merged GoogleChromeLabs/perf-track
The natural height of the container could be larger than 100% of the viewport height, causing it to overflow and overlap with the footer text. This change allows the container to grow to its natural height if needed, and push the footer below it to avoid the overlap.
Before:

After:

I'm not familiar with svelte though so some other building seems necessary to push this change to each individual tool-specific CSS.
pr closed time in a month
startedjohnstew/differential-serving
started time in a month
startedmgechev/is-esm
started time in a month
startedGoogleChromeLabs/tooling.report
started time in a month
issue commentHTTPArchive/almanac.httparchive.org
I can definitely help review this chapter!
Some amazing people in community that I'd like to nominate (only if they're interested in writing for the 2020 Web Almanac of course):
- @tkadlec
- @benschwarz
- @thefoxis
- @denar90
- @ahmadawais
- @jadjoubran
comment created time in a month
issue closedhousseindjirdeh/angular2-hn
Recognize what user style the browser prefers
https://developers.google.com/web/updates/2019/07/nic76#dark-mode Standard is now made available in nearly all major browsers.
closed time in a month
ghostpush eventhousseindjirdeh/angular2-hn
commit sha f6cc578d66c6fa7997f6ef46c7ed4488a85002d8
Bump websocket-extensions from 0.1.3 to 0.1.4 (#85) Bumps [websocket-extensions](https://github.com/faye/websocket-extensions-node) from 0.1.3 to 0.1.4. - [Release notes](https://github.com/faye/websocket-extensions-node/releases) - [Changelog](https://github.com/faye/websocket-extensions-node/blob/master/CHANGELOG.md) - [Commits](https://github.com/faye/websocket-extensions-node/compare/0.1.3...0.1.4) Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
push time in a month
PR merged housseindjirdeh/angular2-hn
Bumps websocket-extensions from 0.1.3 to 0.1.4. <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/faye/websocket-extensions-node/blob/master/CHANGELOG.md">websocket-extensions's changelog</a>.</em></p> <blockquote> <h3>0.1.4 / 2020-06-02</h3> <ul> <li>Remove a ReDoS vulnerability in the header parser (CVE-2020-7662, reported by Robert McLaughlin)</li> <li>Change license from MIT to Apache 2.0</li> </ul> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/faye/websocket-extensions-node/commit/8efd0cd6e35faf9bb9cb08759be1e27082177d43"><code>8efd0cd</code></a> Bump version to 0.1.4</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/3dad4ad44a8c5f74d4f8f4efd3f9d6e0b5df3051"><code>3dad4ad</code></a> Remove ReDoS vulnerability in the Sec-WebSocket-Extensions header parser</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/4a76c75efb1c5d6a2f60550e9501757458d19533"><code>4a76c75</code></a> Add Node versions 13 and 14 on Travis</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/44a677a9c0631daed0b0f4a4b68c095b624183b8"><code>44a677a</code></a> Formatting change: {...} should have spaces inside the braces</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/f6c50aba0c20ff45b0f87cea33babec1217ec3f5"><code>f6c50ab</code></a> Let npm reformat package.json</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/2d211f3705d52d9efb4f01daf5a253adf828592e"><code>2d211f3</code></a> Change markdown formatting of docs.</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/0b620834cc1e1f2eace1d55ab17f71d90d88271d"><code>0b62083</code></a> Update Travis target versions.</li> <li><a href="https://github.com/faye/websocket-extensions-node/commit/729a4653073fa8dd020561113513bfa2e2119415"><code>729a465</code></a> Switch license to Apache 2.0.</li> <li>See full diff in <a href="https://github.com/faye/websocket-extensions-node/compare/0.1.3...0.1.4">compare view</a></li> </ul> </details> <br />
Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.
<details> <summary>Dependabot commands and options</summary> <br />
You can trigger Dependabot actions by commenting on this PR:
@dependabot rebasewill rebase this PR@dependabot recreatewill recreate this PR, overwriting any edits that have been made to it@dependabot mergewill merge this PR after your CI passes on it@dependabot squash and mergewill squash and merge this PR after your CI passes on it@dependabot cancel mergewill cancel a previously requested merge and block automerging@dependabot reopenwill reopen this PR if it is closed@dependabot closewill close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually@dependabot ignore this major versionwill close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)@dependabot ignore this minor versionwill close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)@dependabot ignore this dependencywill close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)@dependabot use these labelswill set the current labels as the default for future PRs for this repo and language@dependabot use these reviewerswill set the current reviewers as the default for future PRs for this repo and language@dependabot use these assigneeswill set the current assignees as the default for future PRs for this repo and language@dependabot use this milestonewill set the current milestone as the default for future PRs for this repo and language
You can disable automated security fix PRs for this repo from the Security Alerts page.
</details>
pr closed time in a month
push eventhousseindjirdeh/Library-Detector-for-Chrome
commit sha b00d63a011c9401b5e4f51f5558625fc67fc5de0
removes img and README reference
push time in a month
PR opened johnmichel/Library-Detector-for-Chrome
Since there's no easy way to detect Create React App on a page, this implementation requested for an asset-manifest.json file that would break auth flows in some sites (e.g. Bitbucket)
Until we find a viable solution, it's probably safest to remove entirely 😞
pr created time in a month
create barnchhousseindjirdeh/Library-Detector-for-Chrome
created branch time in a month
push eventjohnmichel/Library-Detector-for-Chrome
commit sha 170e9704ee52ef4bc2bc64f98febdf6f4acc27f0
update vue detection
push time in a month
Pull request review commentjohnmichel/Library-Detector-for-Chrome
var d41d8cd98f00b204e9800998ecf8427e_LibraryDetectorTests = { return { version }; } + return false;+ }+ },+ 'TYPO3': {+ id: 'typo3',+ icon: 'typo3',+ url: 'https://typo3.org/',+ npm: null,+ test: function (win) {+ const generatorMeta = document.querySelector('meta[name="generator"][content^="TYPO3"]');++ // TYPO3 resource patterns / paths - search in link, style or script tags+ const resourcesTYPO3 = /\/(typo3conf|typo3temp|fileadmin)/;+ const res = Array.from(document.querySelectorAll('link,style,script') || []);++ if (generatorMeta || res.some(s => resourcesTYPO3.test(s.src)) || res.some(s => resourcesTYPO3.test(s.href))) {+ // No version exposure available in TYPO3 due to information disclosure+ return { UNKNOWN_VERSION };
return { version: UNKNOWN_VERSION };
comment created time in a month
pull request commentjohnmichel/Library-Detector-for-Chrome
Handle non-successful asset-manifest requests
@johnmichel Thanks a million for digging in.
I think the safest option would be to remove it entirely until we figure out a way to make it work. I used the method of requesting for asset-manifest.json since there's no specific signatures that can be used to detect usage of CRA. If I had known it would affect authentication on some sites, I wouldn't have merged it in 😅
Thanks again, I'll think of better ways to detect it, but I'll put up a PR soon to remove it for now.
comment created time in 2 months
push eventGoogleChrome/web.dev
commit sha e4136423ef9514f5d314bab582b67d2aace73d14
adds reviewers
push time in 2 months
pull request commentGoogleChrome/web.dev
Updates serve modern code to include bugfixes property
@developit Definitely sounds better now, thanks for updating :)
comment created time in 2 months
push eventGoogleChrome/web.dev
commit sha ec2f2c61dbd2ff61865fdd35b1d555edcb029ca2
removes redundant line
push time in 2 months
push eventGoogleChrome/web.dev
commit sha d1440a2c2af7f54d21e70b586d9c1c04ea9d12d0
Update src/site/content/en/fast/serve-modern-code-to-modern-browsers/index.md Co-authored-by: Jason Miller <[email protected]>
push time in 2 months
push eventGoogleChrome/web.dev
commit sha 6146182ef8e58fb8e2d169a7fff9cd330d4a5d64
Update src/site/content/en/fast/serve-modern-code-to-modern-browsers/index.md Co-authored-by: Jason Miller <[email protected]>
push time in 2 months
pull request commentGoogleChrome/web.dev
CC @anniesullie
comment created time in 2 months
PR opened GoogleChrome/web.dev
Changes proposed in this pull request:
- Updates "Optimize First Input Delay" guide:
- Removes the Minify and compress JavaScript files section
- Moves the entire Reduce JavaScript section to the end of the article
Note: It may look like a lot of text was changed, but it's mostly sections being re-arranged. Going through each of the commits will show the changes easier.
pr created time in 2 months
push eventGoogleChrome/web.dev
commit sha 5b92448994961c4b835cbf5c9f3dc2f79d7aef71
moves reduce javascript section to end of article
commit sha be999f877e26f6da591b6929a41b5e6396987911
removes minify and compress section
commit sha 4899692558e0f571e105bb24cde066cd7bf70813
slight change to reduce javascript execution section
commit sha d3b1c1397fe59f6a69936934b5d024745628487d
updates reviewers
push time in 2 months
push eventGoogleChrome/web.dev
commit sha fc2c4514c1c97ed67356efde6cd9273cf4f21502
updates serve modern code to include bugfixes property
push time in 2 months
PR opened GoogleChrome/web.dev
Changes proposed in this pull request:
- Adds a section on using
bugfixesproperty with@babel/preset-env
CC @connorjclark @developit
pr created time in 2 months
pull request commentjohnmichel/Library-Detector-for-Chrome
Handle non-successful asset-manifest requests
@johnmichel This would still show a 404 if I'm not mistaken? Did you happen to test if it fixes the issue of logging in to BitBucket?
comment created time in 2 months
push eventjohnmichel/Library-Detector-for-Chrome
commit sha d0973aae463b4dbc8446b96a086ee1df9ea28079
Handle non-successful asset-manifest requests Closes #158, #164
commit sha ae864a55e60c69702fc3930ab293bfcfecceb499
Merge pull request #170 from johnmichel/guard-cra-detection Handle non-successful asset-manifest requests
push time in 2 months
PR merged johnmichel/Library-Detector-for-Chrome
Closes #158, #164
pr closed time in 2 months
issue closedjohnmichel/Library-Detector-for-Chrome
Every page loaded in Chrome with this extension enabled is now showing a 404'd request on /asset-manifest.json.
Attached is a screenshot from this very page.
This may be related - I'm no longer to login to Atlassian sites (via id.atlassian.com) unless this extension is disabled.

closed time in 2 months
mavickerspull request commentjohnmichel/Library-Detector-for-Chrome
Handle non-successful asset-manifest requests
Thanks @johnmichel ❤️
comment created time in 2 months
issue commentangular/angular
feat(DomRenderer): allow partial DOM hydration from pre-rendered content
Hi folks 👋🏾.
Dropping some updates here (I work with the Chrome team):
- As Minko mentioned, you can track the progress of the work here. A CL has already been merged to include a new experimental version of LCP that handles removed elements (there's still more work to be done).
- Next steps would involve getting approvals before landing and updating the current implementation of LCP in Chrome's metrics pipeline as well as the web performance API, which can take some time.
This issue was prioritized after noticing it affects server-rendered sites that re-render DOM on the client, so thanks to all of you for flagging!
comment created time in 2 months
startedredwoodjs/redwood
started time in 2 months
pull request commentfacebook/create-react-app
Add performance relayer + documentation (web-vitals)
Awesome thanks all! So happy to see this land :)
comment created time in 2 months
push eventGoogleChrome/web.dev
commit sha 539f84acce577916c115eaccc386b0d3dbef9a36
includes a mention of minsize value and points to full config
push time in 2 months
PR opened GoogleChrome/web.dev
Changes proposed in this pull request:
- Mention
minsizevalue and point to full config in granular chunking article
CC @spanicker
pr created time in 2 months
Pull request review commentfacebook/create-react-app
Adds performance relayer + documentation (web-vitals)
+const reportWebVitals = (onPerfEntry) => {
Oops, added :)
comment created time in 2 months
push eventhousseindjirdeh/create-react-app
commit sha b812d970d10b539598e821a4c17035924c64090a
adds web-vitals to typescript template
push time in 2 months
push eventhousseindjirdeh/create-react-app
commit sha 94224160185cc87baddfde120e0999fcbd3c4910
adds web-vitals to typescript template
push time in 2 months
Pull request review commentfacebook/create-react-app
Adds performance relayer + documentation (web-vitals)
"terser-webpack-plugin": "3.0.2", "ts-pnp": "1.2.0", "url-loader": "4.1.0",+ "web-vitals": "^0.2.2",
Thanks @ianschmitz, moved it to template.json for both templates (default and typescript).
I also had to add it as a dev dependency in the root package.json (otherwise it wouldn't work locally). I hope I'm not doing something wrong here?
comment created time in 2 months
Pull request review commentfacebook/create-react-app
Adds performance relayer + documentation (web-vitals)
ReactDOM.render( // unregister() to register() below. Note this comes with some pitfalls. // Learn more about service workers: https://cra.link/PWA serviceWorker.unregister();++// If you want to start measuring performance in your app, pass a function+// to log results (for example: reportWebVitals(console.log))+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals+reportWebVitals();
It does :))
Lib is dynamically imported only if a function gets passed in
comment created time in 2 months
push eventhousseindjirdeh/create-react-app
commit sha c8a84ba6e12538aa82d00ab7ff55e749d506855a
moves web-vitals lib to template dependency
push time in 2 months
Pull request review commentfacebook/create-react-app
Adds performance relayer + documentation (web-vitals)
ReactDOM.render( // unregister() to register() below. Note this comes with some pitfalls. // Learn more about service workers: https://cra.link/PWA serviceWorker.unregister();++// If you want to start measuring performance in your app, pass a function+// to log results (for example: reportWebVitals(console.log))+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals+reportWebVitals();
@iansu also would it be possible to create a cra.link for the docs page?
comment created time in 2 months
Pull request review commentfacebook/create-react-app
Adds performance relayer + documentation (web-vitals)
ReactDOM.render( // unregister() to register() below. Note this comes with some pitfalls. // Learn more about service workers: https://cra.link/PWA serviceWorker.unregister();++// If you want to start measuring performance in your app, pass a function+// to log results (for example: reportWebVitals(console.log))+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals+reportWebVitals();
Would it be better to not include the function (and import) in the template and show how to add in the docs instead?
comment created time in 2 months
push eventhousseindjirdeh/create-react-app
commit sha de2187d47bc67466a84d79845c32b4eb3812536c
removes console log and fixes typo
push time in 2 months
PR opened facebook/create-react-app
Fixes #8996
Changes included:
- Dynamically imports the
web-vitalslib - Includes a
reportWebVitalsfunction to index.js template (doesn't do anything until a function is passed in)- Note: Would it be better to not include the function and import at all and just show how to add in the docs?
- Adds a "Measuring Performance" page to the documentation
pr created time in 2 months
create barnchhousseindjirdeh/create-react-app
branch : add-performance-relayer
created branch time in 2 months
fork housseindjirdeh/create-react-app
Set up a modern web app by running one command.
fork in 2 months
pull request commentGoogleChrome/web.dev
Minor fixes to "Optimize LCP" and "Optimize FID" articles
Sorry for the confusion. The version number in Yoav's article is correct.
Created a new PR for this.
comment created time in 2 months
PR opened GoogleChrome/web.dev
<!-- Add the DO NOT MERGE label if you don't want the web.dev team
to merge this PR immediately after approving it. -->
Fixes #3046
pr created time in 2 months
push eventGoogleChromeLabs/perf-track
commit sha d3eeea625b016274c33e92840dfeda7cb56930b6
updates about page
push time in 2 months
issue commentjohnmichel/Library-Detector-for-Chrome
False detection of Ember on GMail and Google Docs
Thanks for logging this! Just removed the fast path check 👍
comment created time in 2 months
issue closedjohnmichel/Library-Detector-for-Chrome
False detection of Ember on GMail and Google Docs
Google apps have multiple obfuscated keys in the global window scope:

Among them happens to be window.Em, which leads to falsely detecting "Ember.js (Fast path)" on GMail and Google Docs:

closed time in 2 months
deenamopush eventjohnmichel/Library-Detector-for-Chrome
commit sha 169b894d2e80b9e643773297623132827b76f4c3
removes ember fast path check
commit sha a05e979a453099cbfde45e8086997aae3d625c9e
Merge pull request #169 from housseindjirdeh/fix-ember Removes ember fast path check
push time in 2 months
PR merged johnmichel/Library-Detector-for-Chrome
Fixes #168
False positives when GUID_KEY is not included to check and window. Em is relied on
pr closed time in 2 months
PR opened johnmichel/Library-Detector-for-Chrome
False positives when GUID_KEY is not included to check and window. Em is relied on
pr created time in 2 months
create barnchhousseindjirdeh/Library-Detector-for-Chrome
created branch time in 2 months
push eventjohnmichel/Library-Detector-for-Chrome
commit sha dc142450e79f13be6bef2152affe9b7d1bac3cb8
adds lit element
commit sha 32e02a5b9a2115a646c56bfadbef23e56f9461f5
Merge pull request #167 from housseindjirdeh/add-lit-element Adds lit element
push time in 2 months
PR merged johnmichel/Library-Detector-for-Chrome
pr closed time in 2 months
issue commentGoogleChromeLabs/perf-track
@developit Analyzing usage and performance without jQuery has been widely requested, so it's definitely useful.
Added an issue :) #9
comment created time in 2 months
issue openedGoogleChromeLabs/perf-track
Add "without" sections to each framework view
In addition to including additional web frameworks ("React with Next.js", "Vue with Nuxt.js", etc...), it would be great to have the opposite for some popular variations.
jQuery and Bootstrap are two good places to start. So for example:
- React without jQuery
- React without Boostrap
And the same for Angular, Vue and so forth.
created time in 2 months
push eventGoogleChromeLabs/perf-track
commit sha 6f19dce61946fdb0000c531fb083c6941f941fd6
adds page view events
push time in 2 months
push eventGoogleChromeLabs/perf-track
commit sha 16a61a797389354a318c7caca41be403729b3f98
adds analytics + more
push time in 2 months
push eventGoogleChromeLabs/perf-track
commit sha 6814b31f6a5f19c4809d19f91d12365854d02253
minor update
push time in 2 months
issue closedGoogleChromeLabs/perf-track
Pie chart doesn't reflect listed percentages for "compressed requests"
Example page: https://perf-track.web.app/react
See attached screenshot: The listing for Not compressed is 11.6%. The pie chart segment proportions don't match. This appears to be because the underlying percent for the "Not compressed" value is inflated.

closed time in 2 months
rudygalfi