Can't create screenshots from URL

I am experiencing really inconsistent comparison screenshots when comparing two sites. I've also noticed that when I'm comparing local sites, with .local TLD, I can almost never get all the screenshots. I say 'almost' never because sometimes all screenshots will be produced sometimes 2 of 3 and sometimes 1 of 3. Weird.
Originally, I thought the issue was that the either or both the local or remote site wasn't finished loading, so the screenshot wouldn't occur, but I'm not so sure now. I set the delay to 30s after I received a message in the console. The message loads really late in the painting sequence of the page, but the page is loaded with 30s.

I've also set only 3 viewport sizes. Most times I get at least one of the viewports to capture a screenshot, but never all three. I can capture the three viewports as reference images in bitmaps_references first then run backstop test with a 'url' set.

Ideally, I'd like to only set a 'url' of a development site and a 'referenceUrl' of the production site and then compare those two. I'd also like to use many more viewports if I could. I think this is a relatively basic approach.

I see others have reported similar issues with seemingly random image generations. I'm going to pick through their possible solutions too, but I thought I'd chime in as well.

Let me know if I can test anything or help in any way.

Possible related issues:
https://github.com/garris/BackstopJS/issues/663
https://github.com/garris/BackstopJS/issues/659

Screenshot of results:

(screenshot may not match my config perfectly)

Chrome:
Version 64.0.3282.186 (Official Build) (64-bit)

Backstop:
BackstopJS v3.1.19

```JSON
{
"id": "backstop_default",
"viewports": [
{
"label": "phone",
"width": 320,
"height": 480
},
{
"label": "tablet",
"width": 1024,
"height": 768
},
{
"label": "desktop",
"width": 1500,
"height": 1000
}
],
"scenarios": [
{
"label": "BackstopJS Homepage",
"cookiePath": "backstop_data/engine_scripts/cookies.json",
"url": "http://efficiencyofmovement.local/",
"referenceUrl": "http://www.efficiencyofmovement.com/",
"readyEvent": null,
"readySelector": "",
"delay": 1500,
"hideSelectors": [],
"removeSelectors": [],
"hoverSelector": "",
"clickSelector": "",
"postInteractionWait": "",
"selectors": [
"document"
],
"selectorExpansion": true,
"misMatchThreshold" : 0.1,
"requireSameDimensions": false
}
],
"paths": {
"bitmaps_reference": "backstop_data/bitmaps_reference",
"bitmaps_test": "backstop_data/bitmaps_test",
"engine_scripts": "backstop_data/engine_scripts",
"html_report": "backstop_data/html_report",
"ci_report": "backstop_data/ci_report"
},
"report": ["browser"],
"engine": "chrome",
"engineFlags": [],
"asyncCaptureLimit": 10,
"asyncCompareLimit": 50,
"debug": false,
"debugWindow": false
}
```