Home/ Questions/Q 9254093
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T11:22:50+00:00

I’m creating an application based around the Twitter API 1.1. User defined Twitter profile

  • 0

I’m creating an application based around the Twitter API 1.1. User defined Twitter profile images are pulled in and displayed in the app, and once clicked the latest tweet of the particular account is displayed. Currently this process is initiated on click, using AJAX and a ‘for each’ loop which finds and displays the correct tweet included in a separate php page.

Although this process works fine, once the user has clicked on a profile image the app takes far too long to load the required tweet. I need some advice on how to optimise the process of loading tweets? Perhaps it might not need to be dependent on click, but I’m just not sure how to optimise my code.

Any help will be greatly appreciated.

Here’s the code to help your understanding:

Code which initiates the latest tweet dependent on a particular profile image:

// Create all Tweeter objects
foreach ($tweeters as $i => $tweeter){
$tweeters[$i] = new Tweeter($tweeter, $tmhOAuth);
}

// Display all Tweeters
foreach ($tweeters as $tweeter){
$r+=1;
echo '<a class="fancybox fancybox.ajax" href="tweets.php #' . $r . '">';
echo '<img class="tweetTime' . $r . '" id="' . $r . '" src="' . $tweeter->getImage() . '" width="240px" height="240px" /></a>';
}

Code that gets the tweets in a separate page:

require_once('config/FrameFunctions.php');

foreach ($tweeters as $i => $tweeter){
$tweeters[$i] = new Tweeter($tweeter, $tmhOAuth);
}

foreach ($tweeters as $tweeter){
$r+=1;
echo '<div id="' . $r . '"><p>Latest tweet from <b>' . $tweeter->getName() . '</b>:<br />';

foreach ($tweeter->getTweets() as $tweet){
    echo $tweet['text'] . '<br />';
    echo "Sent: <b>" . $tweet['created_at'] . "</b></p></div>";
 }
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You need to decouple the tweet retrieval from the user click. Move the AJAX to a JQuery ajax() call set to run at intervals. Add a hidden element to hold the latest tweets and update that with the result of the AJAX call. Also change the fancybox call to use the content of the hidden elements instead of having the fancybox making the AJAX call.

    Main HTML:

        <!DOCTYPE html>
    <html>
        <head>
            <title></title>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
            <script src="scripts/jquery.fancybox.js"></script>
            <link rel="stylesheet" type="text/css" href="scripts/jquery.fancybox.css?v=2.1.4" media="screen" />
        </head>
        <body>

            <script type="text/javascript">
            $(document).ready(function() {

                         $('.fancybox').fancybox();
                /*
                 *  call ajax function and update latest
                 */     

                            var refreshTweets = function() {
                              console.log("updating..");
                              $.ajax({url:"updatetweets.php",success:function(result){
                                tweets = eval(result);
                                for(i=0;i<tweets.length;i++){
                                    $("#latesttweet"+(i+1)).html(tweets[i]);      
                                }

                              }});
                            }
                            //set the time in milliseconds here for each refresh
                            setInterval(refreshTweets , 30000); //Interval


                    });  
            </script>
    <?php

    //Setting up objects, you won't need this part
    $tweeters = array("one", "two", "three");
    $tmhOAuth = 0;
    $r =0;

    Class Tweeter{
        function __construct(){
            return array("bob", "sue", "derek");
        }

        function getImage(){
            return "images/turpin.gif";
        }
    }
    //end set up objects


     // Create all Tweeter objects
    foreach ($tweeters as $i => $tweeter){
        $tweeters[$i] = new Tweeter($tweeter, $tmhOAuth);
        }

        // Display all Tweeters
        foreach ($tweeters as $tweeter){
        $r+=1;
        echo '<a class="fancybox" href="#latesttweet' . $r . '">';
        echo '<img class="tweetTime' . $r . '" id="' . $r . '" src="' . $tweeter->getImage() . '" width="240px" height="240px" /></a>';
        echo '<span id="latesttweet'. $r .'" style="display: none;">Tweet text will go here</span>';
    }

    ?>

    </body>
    </html>

    Update Tweets code (Ajax php) :

        <?php
    //Setting up objects, ignore this part
    $tweeters = array("bob", "sue", "derek");
    $tmhOAuth = 0;
    $r =0;

    Class Tweeter{
        private $thetweeter;

        function __construct($tweeter){
            $this->theTweeter =  $tweeter;
        }    

        function getTweet(){
            return $this->theTweeter  . "'s tweet at ". date('H:i:s') ;
        }
    }
    //end set up


    foreach ($tweeters as $i => $tweeter){
        $theTweeter = new Tweeter($tweeter, $tmhOAuth);
        $tweeters[$i] = $theTweeter->getTweet();
    }

    header("Content-type: application/json");
    echo json_encode($tweeters);
    ?>
    • 0