juliansteenbakker / mobile_scanner

A universal scanner for Flutter based on MLKit. Uses CameraX on Android and AVFoundation on iOS.
BSD 3-Clause "New" or "Revised" License
817 stars 476 forks source link

Ios Simulator List View Jank #1149

Open BraydenKlemens opened 4 weeks ago

BraydenKlemens commented 4 weeks ago

When adding this package to any flutter project it causes jank frames on the ios simulator. This occurs when performing any animation such as switching between tab-bar tabs or scrolling a list view. Current device is apple m1.

navaronbracke commented 4 weeks ago

Could you provide a minimal reproducible sample? Scrolling jank can have multiple reasons. I doubt that the inclusion of a PlatformView for the camera preview would cause scrolling jank in this case.

What version of the library are you using? What Flutter version are you using? (There was a recent bugfix in Flutter for rendering artifacts when using Impeller on the iOS Simulator)

BraydenKlemens commented 4 weeks ago

Here is a Video of the list view jank before and after adding mobile_scanner https://github.com/user-attachments/assets/6b2329ae-38c6-4e1f-843c-ff5ecd01bb7f

Versions:

Steps to Reproduce

Code:

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(title),
      ),
      body: ListView.builder(
        itemCount: 15,
        itemBuilder: (context, index) {
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: ListTile(
              tileColor: Colors.deepPurple.shade100,
              title: Text('Item $index'),
            ),
          );
        },
      ),
    );
  }
}
haven-git commented 3 weeks ago

same issue

fmaerkl-sw commented 2 weeks ago

This is due to #1018 when the app is run through Rosetta automatically.

navaronbracke commented 2 weeks ago

This is due to #1018 when the app is run through Rosetta automatically.

Interesting finding! I'm not sure if MLKit supports arm64 Simulators, so we would have to look into that.

But then the list view jank is just because the app is ran through Rosetta?

What Flutter version are you using?

@BraydenKlemens I'll have to ask again, what Flutter version are you on? Earlier Flutter versions used Rosetta when running on arm64 (and I believe that was also the case for the iOS Simulator)

Could you try to see if this also happens with the latest Flutter version? (or maybe one of the last three stable releases)

fmaerkl-sw commented 2 weeks ago

But then the list view jank is just because the app is ran through Rosetta?

Yes. Likely the JIT used by Flutter in Debug mode does not play well with the translation.

BraydenKlemens commented 2 weeks ago

@navaronbracke flutter version is 3.24. Please refer to previous post for a list of versions.

I will try some earlier stable versions as well, to see if the issue persists.

navaronbracke commented 2 weeks ago

Ah, yes sorry I missed that. Could still be something with arm64 iOS Simulators though

navaronbracke commented 2 weeks ago

Does this reproduce with Impeller off?

theSharpestTool commented 2 weeks ago

Hi @navaronbracke @BraydenKlemens I've also faced with it. Looks like the issue doesn't occur with Impeller off:

Impeller without the package

Screenshot 2024-08-29 at 12 47 02

Impeller with the package

Screenshot 2024-08-29 at 12 44 06

Skia with/without package

Screenshot 2024-08-29 at 12 56 16