Adam Patterson
I have been using Webpack with my WordPress development now fo a few years and implemented it using Laravel Mix. You can read more about that here. But more recently I have started using BrowserSync, mostly because I was working on a front end heavy site and was doing a lot more incremental changes to the SCSS.
But off the start, I noticed that the reload speeds were terrible. Far slower than manually refreshing the browser.
Previously I would have used a .dev domain name, but Google was nice enough to force HTTPS on those gTLD’s so I wad forced like many to pick a new local gTLD or generic top-level domain. Some common choices were .site or .test but I went with .local never really thinking much of the implications.
When looking into why my page reloaded so slowly ( even without using Browsersync it was very slow ) I noticed that I was using IP6, which I think was a fix for previous versions of macOS and local domains. macOS for whatever reason has some very poor DNS resolution for a .local, oddly enough any alternative choice was fast like .wp or .site.
Anyways, After a quick sanity check, I ran the following curl command time curl -I http://site.local/ > /dev/null Which resulted in 6 seconds.
After adding 127.0.0.1 as well, and before the IP6 entry the time was drastically reduced to 0.7 seconds!
127.0.0.1 site.local
::1 site.local
The best thing about this fix is that there is no need to adjust your webpack config 🙂
