Taking Long time to push a UIView to UINavigation Controller when calling [self.navigationController pushViewController:animated:]

Question

I am trying to push a UIView onto the another UIView by calling this method of UINavigationController:

signupPageObj = [[SignupPage alloc]initWithNibName:@"SignupPage" bundle:nil];
[self.navigationController pushViewController:signupPageObj animated:YES]; 

But it got stuck for some time to load my SignUpPage UIView. I don't know what is the reason but because I don't have so much customization in viewDidLoad as well as method initWithNibName.

The Whole code for initWithNibName is given below:

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];

    if (self) 
    {
        statusArray=[[NSMutableArray alloc] init];
        UILabel *labelforNavigationTitle = [[UILabel alloc] initWithFrame:CGRectZero];
        labelforNavigationTitle.backgroundColor = [UIColor clearColor];
        labelforNavigationTitle.font = [UIFont fontWithName:FONTSAVINGSBOND size:30.0];
        labelforNavigationTitle.shadowColor = [UIColor colorWithWhite:0.0 alpha:0.5];
        labelforNavigationTitle.textAlignment = UITextAlignmentCenter;
        labelforNavigationTitle.textColor = [UIColor whiteColor]; // change this color
        self.navigationItem.titleView = labelforNavigationTitle;
        labelforNavigationTitle.text = NSLocalizedString(@"Sign Up", @"");
        [labelforNavigationTitle sizeToFit];

    }
    return self;

}


-(void)viewDidLoad
{

    [super viewDidLoad];

    self.fullPathToFile=@"";
    self.gender=@"";
    strForGender=self.gender;
    labelInDatePicker.font=[UIFont fontWithName:FONTCENTURYGOTHICBOLD size:17.0];


    UIImage* imageCancel = [UIImage imageNamed:@"cancelbtn.png"];
    CGRect frameimg = CGRectMake(0, 0, (imageCancel.size.width)/2, (imageCancel.size.height)/2);


    UIButton *cancelButton = [[UIButton alloc] initWithFrame:frameimg];
    [cancelButton setBackgroundImage:imageCancel forState:UIControlStateNormal];
    [cancelButton addTarget:self action:@selector(cancelButtonclickedInAvtar)
         forControlEvents:UIControlEventTouchUpInside];
    [cancelButton setShowsTouchWhenHighlighted:YES];



    self.pickerBirthdayView.frame=CGRectMake(0,460,320,252);
    [self.view addSubview:self.pickerBirthdayView];

    self.avtarView.frame=CGRectMake(0,460,320,460);
    [self.view addSubview:self.avtarView];
    cancelButtonInAvtarView=[[UIBarButtonItem alloc]initWithCustomView:cancelButton];

    self.termsAndConditionPage.frame=CGRectMake(0,460,320,460);
    [self.view addSubview:self.termsAndConditionPage];


    if ([self.navigationController.navigationBar respondsToSelector:@selector(setBackgroundImage:forBarMetrics:)] ) 
    {
        UIImage *image = [UIImage imageNamed:@"titlebg.png"] ;
        [self.navigationController.navigationBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
    }
    [self performSelector:@selector(settingScrollView) withObject:nil afterDelay:1.0];

    scrollPrevButton.hidden=YES;
    scrollNextButton.hidden=NO;

    isSectionExpanded=NO;
    checkForImage=2;
    termsAndConditionChecked=2;
    checkForBackgroundImage=10;
    start=10;


    UIImage* image1 = [UIImage imageNamed:@"backbtn.png"];
    CGRect frameimg1 = CGRectMake(0, 0, (image1.size.width)/2, (image1.size.height)/2);

    UIButton *backButton = [[UIButton alloc] initWithFrame:frameimg1];
    [backButton setBackgroundImage:image1 forState:UIControlStateNormal];
    [backButton addTarget:self action:@selector(popToRootViewController)
         forControlEvents:UIControlEventTouchUpInside];


    //    UIImage* image2 = [UIImage imageNamed:@"submitbtn.png"];
    //    CGRect frameimg2 = CGRectMake(0, 0, (image2.size.width)/2, (image2.size.height)/2);

    //    UIButton *submitButton = [[UIButton alloc] initWithFrame:frameimg2];
    //    [submitButton setBackgroundImage:image2 forState:UIControlStateNormal];
    //    [submitButton addTarget:self action:@selector(submitButtonPressed:)forControlEvents:UIControlEventTouchUpInside];


    UIImage* imageforTermsandConditionPage = [UIImage imageNamed:@"backbtn.png"];
    CGRect frameimgforTermsandConditionPage = CGRectMake(0, 0, (imageforTermsandConditionPage.size.width)/2, (imageforTermsandConditionPage.size.height)/2);

    UIButton *backButtonforTermsandConditionPage = [[UIButton alloc] initWithFrame:frameimgforTermsandConditionPage];
    [backButtonforTermsandConditionPage setBackgroundImage:imageforTermsandConditionPage forState:UIControlStateNormal];
    [backButtonforTermsandConditionPage addTarget:self action:@selector(backtoSignupPage) forControlEvents:UIControlEventTouchUpInside];



    UIImage* imageforChooseIconPage = [UIImage imageNamed:@"backbtn.png"];
    CGRect frameimgforChooseIconPage = CGRectMake(0, 0, (imageforChooseIconPage.size.width)/2, (imageforChooseIconPage.size.height)/2);

    UIButton *backButtonforChooseIconPage = [[UIButton alloc] initWithFrame:frameimgforChooseIconPage];
    [backButtonforChooseIconPage setBackgroundImage:imageforTermsandConditionPage forState:UIControlStateNormal];
    [backButtonforChooseIconPage addTarget:self action:@selector(backtoSignupPage) forControlEvents:UIControlEventTouchUpInside];



    backButton1 = [[UIBarButtonItem alloc] initWithCustomView:backButton];
    self.navigationItem.leftBarButtonItem = backButton1;

    //    submitButton1=[[UIBarButtonItem alloc]initWithCustomView:submitButton];
    //    self.navigationItem.rightBarButtonItem=submitButton1;

    backButtonInTermsAndCondition=[[UIBarButtonItem alloc]initWithCustomView:backButtonforTermsandConditionPage];
    backButtonInChooseIcon=[[UIBarButtonItem alloc]initWithCustomView:backButtonforChooseIconPage];


    CALayer *layer = [self.objTextView layer];
    [layer setMasksToBounds:YES];
    [layer setCornerRadius:10.0];
    [layer setBorderWidth:0.0];
    [layer setBorderColor:[[UIColor lightGrayColor] CGColor]];
}


-(void)settingScrollView
{
    arrOfImages=[NSArray arrayWithObjects:@"Avtar0.png",@"Avtar1.png",@"Avtar2.png",@"Avtar3.png",@"Avtar4.png",@"Avtar5.png",@"Avtar6.png",@"Avtar7.png",@"Avtar8.png",@"Avtar9.png",nil];

    pageControl.numberOfPages = kNumberOfPages;
    pageControl.currentPage = 0;
    pageControl = [[PageControl alloc] initWithFrame:rect] ;
    pageControl.frame = rect;
    pageControl.delegate=self;
    pageControl.numberOfPages=[arrOfImages count];
    pageControl.currentPage = self.currentPage;
    [self.view addSubview:pageControl];

    scrollV = [[UIScrollView alloc]init];
    scrollV.frame=CGRectMake(35,55,250,246);
    scrollV.backgroundColor=[UIColor clearColor];
    scrollV.delegate=self;
    scrollV.pagingEnabled=YES;
    self.scrollV.contentSize = CGSizeMake(self.scrollV.frame.size.width *kNumberOfPages, 220);

    self.scrollV.showsHorizontalScrollIndicator = NO;
    self.scrollV.showsVerticalScrollIndicator = NO;
    self.scrollV.scrollsToTop = NO;
    self.scrollV.delegate = self;

    [self.avtarView addSubview:scrollV];


    for(int k =0;k<arrOfImages.count;k++)
    {

        UIButton *btn=[UIButton  buttonWithType:UIButtonTypeCustom];
        btn.tag=k;
        btn.imageView.contentMode= UIViewContentModeScaleAspectFit;
        [btn setImage:[UIImage imageNamed:[arrOfImages objectAtIndex:k]] forState:UIControlStateNormal];
        [btn setImage:[UIImage imageNamed:[arrOfImages objectAtIndex:k]] forState:UIControlStateHighlighted];
         btn.frame=CGRectMake((self.scrollV.frame.size.width * k),0, 250,241);
        [btn addTarget:self action:@selector(setImageInScrollView:) forControlEvents:UIControlEventTouchUpInside];
        [self.scrollV addSubview:btn];
    }

}

I will be greatful if any one has a suggestion or solution for this.

Answer 1

I notice that your settingScrollView is loading a bunch of images and (especially if they're large) that can be slow. It's also an extravagant use of memory. There are two common solutions to this problem:

1. You can employ asynchronous image loading. Rather that loading the images in the main queue, you can use GCD (or any concurrent technology) to load the images in the background, and then dispatch the setting of the image view image property back to the main queue. This solves the performance issue, but not the memory issue.

2. Even better, you can employ lazy loading, only loading the images for the currently visible images. Then configure your view controller to be a UIScrollViewDelegate and when the user scrolls to the next image, load it then. You can do a variation of this that loads the current image and the "next" image, and when the user scrolls to the next image, you lazily load the new "next" image. Most lazy-loading techniques also employ asynchronous image loading, my first observation.

---

Update:

Clearly, your presentation of your screen will improve if you replace your line that says:

[self performSelector:@selector(settingScrollView) withObject:nil afterDelay:1.0];

with just:

[self settingScrollView];

But I presume you were delaying that a second for a reason. Perhaps you didn't like the delay that loading the ten images took and you didn't want to slow down your entire user interface because of that. So you can employ my first technique, the asynchronous loading of the images, to not block the user interface while loading the images. If you wanted to do that, you could replace the for loop in settingScrollView with something like:

dispatch_queue_t queue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0);

for (int k = 0; k < arrOfImages.count; k++)
{
    UIButton *btn = [UIButton  buttonWithType:UIButtonTypeCustom];
    btn.tag = k;
    btn.imageView.contentMode = UIViewContentModeScaleAspectFit;
    dispatch_async(queue, ^{

        // retrieve the image in a background queue

        UIImage *image = [UIImage imageNamed:[arrOfImages objectAtIndex:k]];

        // and now update the image property in your UI in the main queue

        dispatch_async(dispatch_get_main_queue(), ^{
            [btn setImage:image forState:UIControlStateNormal];
            [btn setImage:image forState:UIControlStateHighlighted];

            btn.frame=CGRectMake((self.scrollV.frame.size.width * k),0, 250, 241);
            [btn addTarget:self action:@selector(setImageInScrollView:) forControlEvents:UIControlEventTouchUpInside];
            [self.scrollV addSubview:btn];
        });
    });
    // btn.frame=CGRectMake((self.scrollV.frame.size.width * k),0, 250, 241);
    // [btn addTarget:self action:@selector(setImageInScrollView:) forControlEvents:UIControlEventTouchUpInside];
    // [self.scrollV addSubview:btn];
}

Having said that, the loading of the images via imageNamed generally is not that slow (though if the images are really big, it can introduce an observable, if modest, delay). But the above code will further minimize the user interface delay that loading the images from persistent storage imposes. Assuming your images are roughly 250x241, the performance improvement is modest (sure, it returns to my user interface ten times as quickly, but since the, but loading the images synchronously only took only 0.05 seconds, whereas loading them asynchronously, my UI returned in 0.005 seconds). This technique is very useful when shooting for really smooth tableview scrolling, or if loading images from the web, but it's not clear it's worth it here (unless your images are huge).

I won't tackle my second point, the lazy loading of images, unless you tell us that you're having memory problems. If that's the case, we'd replace the imageNamed method with imageWithContentsOfFile (since imageNamed is a very crude caching system) and wrap that in a proper lazy loading scheme. But with only ten images, you might not need to go there. So I'll defer that solution unless you come back and tell us that you have serious memory issues.