dariocavada / panorama_viewer

Panorama Viewer - Flutter Widget
Apache License 2.0
7 stars 3 forks source link

Flutter Web Support & Performance #13

Open aykutuludag opened 3 months ago

aykutuludag commented 3 months ago

Hello. I was suspicious that it won't work on web but it is working. I thought it won't work because pub.dev shows that this plugin on support Android & iOS, not other platforms. Maybe you should check on that. I'm giving 10/10 to this plugin. Good job!

image

aykutuludag commented 3 months ago

Now I tested detailed with high quality panoramic images. It is working well on Flutter Web website if you open on desktop, but if you open mobile (Android or iOS doesn't matter) it is lacking, it's very slow and gets stuck. The tests were performed on the following URL and the Flutter Android&iOS apps:

A Flutter Web page with panorame_viewer: https://aparti.kz/place360/9

Test Results with above url: image

Fail means either it doesn't work or it is lagged beyond acceptable level of slowness.

What can be a problem? Filesize, resolution or plugin's itself?

image

What's your recommended image file size and resolution? Best regards.

UPDATE: I reduced file dimensions *40962048 and 2.3 mb** as a file size. But it still doesn't work like the test results above.

UPDATE 2: I reduced to 1920 x 1079 with 271 kb but test results same. Seems like Flutter Web on mobile phone doesn't open PanoramaViewer for some reason. It works on as Android or iOS app smoothly.

UPDATE 3: To understand what is going on, I connected my iPhone 14 to Macbook to read console log's of iPhone on Mac's Safari. When I try to enter above url on my phone, these errors occurring. It doesn't mean so much thing because it is minifed code and I don't know how to debug Flutter Web app on Safari. Here is the logs:

Screenshot 2024-06-21 at 20 27 25
aykutuludag commented 3 months ago

Our code is pretty straighforward.

body: Padding(
        padding: const EdgeInsets.all(0.0),
        child: kIsWeb
                ? PanoramaViewer(
                    child: Image.network("360_PHOTO_URL"))
                : PanoramaViewer(
                    sensorControl: SensorControl.orientation,
                    child: Image.network("360_PHOTO_URL"))
 )