Created by: haydenbleasel
This issue was originally introduced 2 years ago in issue #1966 but was dismissed by @mdo, stating:
In Chrome and Safari, I didn't notice much of a different at all (in fact I couldn't really discern any difference). We'll pass on this for now, but revisit it in a future point release since I know transitions and moving objects like this can get hairy quickly.
As @petewarden explained:
The -webkit-transform extension causes webkit to switch to hardware-accelerated rendering on supported devices, which results in far smoother animations. This CSS change enables the extension for the carousel when it's available, and in practice we see iPad and iPhone animations improve from a juddery 2 frames-per-second at best, to something smooth enough to be native.
I believe it's time to reconsider this implementation as it suits Bootstrap 3's mobile-first approach. The effects of implementing CSS3 transforms are significant on all WebKit devices I've tested, especially when using high-res images or multiple carousels (due to the large repaint times). For a full description of this issue including technical info and research, check out this Medium article.
I was going to comment on the previous issue but I rewrote the code to explicitly use 3D transforms to ensure hardware acceleration is enabled and some other helpful properties for visual integrity.