wordpress上的优化建议和AJAX加载

时间:2014-01-30 18:50:08

标签: javascript php jquery ajax wordpress

我目前正在完成我使用wordpress 3.8和自定义团队模板(TwentyFourteen)的投资组合,因为这是我第一次尝试使用wordpress做一些很酷的事情。 去那里看看:http://micheldidier.com

最后一部分是关于优化。我已经和我的主机争论了一下,因为第一个字节接收需要很长的等待时间。这是他们的坏,并且在他们添加了一些其他服务器后它有所改变。我已经使用了W3 Total Cache加速了一下,并设置了Cloud Flare。真的不知道这是不是一个好习惯......

问题是我做了一个AJAX导航。我不知道我是不是这样做了......为什么? 也许以下数字我们会为你改变,但是:

- 当我第一次加载网站时,在清理缓存后,加载大约需要4秒钟。 - 当我点击项目链接/和/或其他页面时,它使用ajax加载,但需要花费更多时间......

为什么要花这么多时间?我该怎么做才能改变它?使用AJAX应该能够平滑地加载内容,如果花费更多的时间,使用AJAX就没什么好处的......

这是我的js代码:

jQuery(document).ready(function($) {

    $(window).hashchange( function(){

        //finding the link
        var arg = window.location.hash.substring(3);
        var link = 'http://micheldidier.com/'+arg; //replacing root URI !!

        //requete ajax
        $.ajax({  
            url:link,
            processData:true, //Object result
            dataType:'html', //type html
            async: true, 
            complete: function(xhr, text) {},
            cache: true,
            error: function(xhr, text, e) {},
            global: true,
            headers: {},
            statusCode: {},
            success:function(data){
                // callback
                data = innerShiv(data,false);
                var thecontent = $(data).find("#content-article");
                var title = $(data).filter('title').text();
                document.title = title;
                $('#content-home').slideToggle('slow',function(){
                    $(this).html(thecontent).slideToggle('slow', function(){
                        $.scrollTo('#content-article', 600);
                        return false;
                        });
                });
            }
         });
    });

    //hash onload
    if(window.location.hash.substring(3)!=''){
        $(window).trigger( 'hashchange' );
    }
我问的问题是,如果问题仍然是因为我的主持人。因为我的jQ?还是因为PHP?

这是我的主页PHP代码:

get_header(); ?>

<div id="main-content" class="main-content">
<div id="top-sidebar" class="top-sidebar widget-area" role="complementary">
    <?php dynamic_sidebar( 'sidebar-4' ); ?>
</div><!-- #top-sidebar -->
<div id="content-home"></div>
<?php
    if ( is_front_page() && twentyfourteen_has_featured_posts() ) {
        // Include the featured content template.
        get_template_part( 'featured-content' );
    }
?>
<div id="primary" class="content-area">
    <div id="content" class="site-content" role="main">
        <?php
            if ( have_posts() ) :
                // Start the Loop.
                while ( have_posts() ) : the_post();

                    /*
                     * Include the post format-specific template for the content. If you want to
                     * use this in a child theme, then include a file called called content-___.php
                     * (where ___ is the post format) and that will be used instead.
                     */
                    get_template_part( 'content-home', get_post_format() );

                endwhile;
                // Previous/next post navigation.
                twentyfourteen_paging_nav();

            else :
                // If no content, include the "No posts found" template.
                get_template_part( 'content', 'none' );

            endif;


        ?>
    </div><!-- #content -->
</div><!-- #primary -->
</div><!-- #main-content -->
<?php get_footer();

这是我的单页PHP代码:

    if ($_GET["ajax"]==true) get_template_part('header-ajax');
else get_header(); ?>


    <div id="primary" class="content-area">
        <div id="content-article" class="site-content" role="main">
            <?php
                // Start the Loop.
                while ( have_posts() ) : the_post();

                    /*
                     * Include the post format-specific template for the content. If you want to
                     * use this in a child theme, then include a file called called content-___.php
                     * (where ___ is the post format) and that will be used instead.
                     */
                    get_template_part( 'content', get_post_format() );

                    // Previous/next post navigation.
                    twentyfourteen_post_nav();

                endwhile;
            ?>
        </div><!-- #content -->
    </div><!-- #primary -->

<?php
get_sidebar( 'content' );
get_sidebar();
get_footer();

我认为这就是全部,如果您还需要其他任何东西,请随意提问!如果你有任何其他“最佳实践”的建议,请随时告诉我!

感谢您的时间!!

0 个答案:

没有答案