在使用SQLAlchemy的Flask Web應用程序中，當顯示來自大型PSQL數據庫的數據時如何改善頁面加載時間？

Question

我正在使用一個簡單的Flask Web應用程序，該應用程序在Bootstrap表中顯示來自PSQL數據庫的數據（2000多個項目）。 問題是顯示表的頁面需要很長時間才能加載。

我的models.py ：

from app import db

class Movie(db.Model):
    __tablename__ = 'movies'

    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(60), index=True, unique=True)
    director = db.Column(db.String(60), index=True)
    release_date = db.Column(db.Date, index=True)
    duration = db.Column(db.Integer)

    def __repr__(self):
        return '<Movie: %s>' %(self.name)

我的views.py ：

@home.route('/')
    movies = Movie.query.all()
    return render_template('home/index.html', movies=movies)

數據在index.html加載如下：

{% for movie in movies %}
<tr>
    <td> {{ movie.id }} </td>
    <td> {{ movie.name }} </td
    <td> {{ movie.director }} </td>
    <td> {{ movie.release_date }} </td>
    <td> {{ movie.duration }} </td>
</tr>
{% endfor %}

我正在為表使用分頁，盡管只是在視覺上（數據仍然在開始時完全加載）。 為此，我使用了Bootstrap-Table，所以我的表看起來像這樣 。

在我看來，最好的選擇是先加載15個項目並顯示它們。 加載完所有其他內容后，即可加載其余項目。 但是，我不確定如何執行此操作。

如何改善表格頁面的加載時間？

Answer 1

你應該分頁 。 您可以使用AJAX請求獲得更多結果，而不必重新加載頁面。 您可以對任何查詢進行分頁，以避免一次加載所有項目。 相反，它一次只會加載您所要求的數量。

考慮以下視圖和模板，這些視圖和模板演示了分頁對象的用法。

@app.route('/', methods=['GET', 'POST'])
@app.route('/index', methods=['GET', 'POST'])
@app.route('/index/<int:page>', methods=['GET', 'POST'])
@login_required
def index(page=1):
    form = PostForm()
    if form.validate_on_submit():
        post = Post(body=form.post.data, timestamp=datetime.utcnow(), author=g.user)
        db.session.add(post)
        db.session.commit()
        flash('Your post is now live!')
        return redirect(url_for('index'))
    posts = g.user.followed_posts().paginate(page, POSTS_PER_PAGE, False).items
    return render_template('index.html',
                           title='Home',
                           form=form,
                           posts=posts)

然后是模板

<!-- posts is a Paginate object -->
{% for post in posts.items %}
<p>
  {{ post.author.nickname }} says: <b>{{ post.body }}</b>
</p>
{% endfor %}
{% if posts.has_prev %}<a href="{{ url_for('index', page=posts.prev_num) }}">&lt;&lt; Newer posts</a>{% else %}&lt;&lt; Newer posts{% endif %} | 
{% if posts.has_next %}<a href="{{ url_for('index', page=posts.next_num) }}">Older posts &gt;&gt;</a>{% else %}Older posts &gt;&gt;{% endif %}

產生這樣的頁面，即使有100萬個可能的結果來自查詢，也只等待3個結果。

您可以在Flask Mega-Tutorial中看到此代碼的更多解釋