`loaded()` and `on('load')` event do not work as expected

Nobody has claimed this yet.

**mapbox-gl-js version**: 0.45.0

### Question

There are certain methods that you cannot call while the map is still loading, such as `map.addLayer()`. You can use the `map.on('load')` event to know when it is safe to call these methods, however there is no corresponding method like `map.ready()` for knowing that it is safe to call `map.addLayer()`. `map.loaded()` can also return false during other method calls, such as `map.setLayoutProperty()`, and you can safely call `map.addLayer()` when `map.loaded()` returns `false`. Also if `map.loaded()` returns `false` then `map.on('load')` only works the first time, so you need to track the initial load state yourself.

Every time I have tried to make a complex map with mapbox-gl I have hit some kind of frustrating bug that was related to loading state and these events. They have changed gradually over versions but they still don't work as expected.

It would be great if `mapbox-gl` could just track its ready state internally, so that calling `map.addLayer()` just worked as expected straight away. Either that or we need methods that correspond to load events. I want to do something like this:

```js
if (map.loaded()) {
map.addLayer(...)
} else {
map.on('load', () => map.addLayer(...))
}
```

But this will only work the first time (`map.on('load')` only fires once), but sometimes `map.loaded()` will return false if the map is moving.

### Links to related documentation

Start by reproducing the loading-state behavior around map.loaded(), map.on('load'), map.addLayer(), and map.setLayoutProperty() in the reported 0.45.0 scenario. Determine the intended ready-state and event semantics, then verify that the chosen behavior works both during initial loading and while the map is moving.

Written by the indexing model from the issue text.