Combining this to be efficient

JavaScript
1 
function renderTweets(obj){
  
  var checkTweets = setInterval(function(){
    if( $(obj).find('iframe[id*="twitter-widget"]').contents().find('.timeline-TweetList-tweet').length > 0 ){
      clearInterval(checkTweets);

      var twt =  $(obj).find('iframe[id*="twitter-widget"]').contents();
      var tweets = twt.find('.timeline-TweetList-tweet');
      var show = 1;

      $(obj).find('.fsElementContent').append('<ul class="tweets">');

      tweets.each(function(i){
        if(i<show+1){
          $(this).appendTo($(obj).find('.tweets'));
          var $el = $(obj).find(".tweets > li:last-child")
          var html = $el.html();
          var regex = /class="(.*?)"/g;
          html = html.replace(regex, function(className) {
            return className.replace(/-/g, '-');
          });
          $el.html(html);
        }
      });

      $(obj).find('iframe[id*="twitter-widget"]').hide();

    }
  },100);
}

It was mentioned by @fretburner that this part is inefficient

var $el = $(obj).find(".tweets > li:last-child")
          var html = $el.html();
          var regex = /class="(.*?)"/g;
          html = html.replace(regex, function(className) {
            return className.replace(/-/g, '-');
          });
          $el.html(html);

Is therea way to do this where I don’t take the newly-appended code, pull it back out, do the regex, and put it back in (and all within a loop)?

Ideally just run this once over the entire DOM set? I tried modifying var twt but I think .contents() isn’t the same as .html() so it’s erroring out there.

I don’t need the code here, but just where I should do it? Thanks.

1 Like
2

For code that is only to be run once the time taken to write the code is the part that is most inefficient. The quicker you can write it the more efficient it will be even if it runs ten times slower than it would if you spent twice as much time writing it.

3

I suspect the issue you’re trying to solve is a character encoding problem with the hyphen so I think you’ll be able to safely run the replacement on the entire twt string, rather than looping through the individual tweets.

1 Like
4

Why does this not work?

var twt =  $(obj).find('iframe[id*="twitter-widget"]').contents();
      var tweets = twt.find('.timeline-TweetList-tweet');//the <li> of each tweet
      var show = 1;

      var $el = tweets.parent();//the parent of all the tweets
      var html = $el.html();//the entire dom set
      var regex = /class="(.*?)"/g;
      html = html.replace(regex, function(className) {
        return className.replace(/-/g, '-');
      });
      $el.html(html);

Full script

function renderTweets(obj){
  
  var checkTweets = setInterval(function(){
    if( $(obj).find('iframe[id*="twitter-widget"]').contents().find('.timeline-TweetList-tweet').length > 0 ){
      clearInterval(checkTweets);

      var twt =  $(obj).find('iframe[id*="twitter-widget"]').contents();
      var tweets = twt.find('.timeline-TweetList-tweet');
      var show = 1;

      var $el = tweets.parent();
      var html = $el.html();
      var regex = /class="(.*?)"/g;
      html = html.replace(regex, function(className) {
        return className.replace(/-/g, '-');
      });
      $el.html(html);

      $(obj).find('.fsElementContent').append('<ul class="tweets">');

      tweets.each(function(i){
        if(i<show+1){
          $(this).appendTo($(obj).find('.tweets'));
        }
      });

      $(obj).find('iframe[id*="twitter-widget"]').hide();

    }
  },100);
}

Where is my logic wrong?

1 Like
5

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.