Question

Subjective question时间！

我为一个开放式组织托管大量文件和文件夹的网站编写代码，该网站必须在线发布所有文档以供公众审查。我还没有开始编码实际的观众，因为我想知道标准的，最容易接近的方法是什么。

该网站必须易于访问，并且可用于从台式机到手机的所有设备。也就是说，我不必为旧的，过时的浏览器编写代码。上一个站点在Python和Django上使用了静态方法。这是我的第一个真正的node.js + Express工作，我不确定性能差异。

目前，我认为有两种方法可以完成我的任务：

1。使用Ajax

我知道我可以将所有人推到通用的/documents页面上，并允许他们自己浏览文件夹。但是，如果共享，我希望文档链接起作用，因此我必须在用户移动时手动更改URL，并将大量Ajax请求提交回服务器

我喜欢这种方法，因为它可能会提供更好的用户互动。我不喜欢大量的Ajax请求，我担心在手机和平板电脑等功能较弱的设备上，所有Ajax和DOM操作都会变慢或无法正常工作。此外，我必须将URL解析为具有后端或前端的资源以供检索。

2。去＆＃39;静态＆＃39;

我在后端使用node.js和Jade，所以我知道我可以拆分网址，找到文件夹层次结构，并为用户提供一个全新的页面。

我喜欢这种方法，因为它不需要用户的机器进行任何计算（并且在较慢的设备上可能会更快），这意味着没有做大量的网址工作。我不喜欢桌面用户最终会等待一堆同步操作，我必须使用这些操作来准备页面，服务器负载或响应能力。

目前

我现在正在研究静态方法，因为我认为它更具可访问性（即使以页面加载时间为代价），但我在这里获取更多信息来指导正确选择。我正在寻找能够解释为什么走哪条路会更好，并且公正或分享经验的答案。预先感谢您的帮助！

Answer 1

右。所以没有其他人回复，所以我还是继续做了文件浏览器。

我最终做了一个静态方法。事实证明它相对容易，除了必须操纵一堆字符串之外，我只能想象Ajax需要两倍的工作。

响应时间相当长：在我的网站上不进行计算的通用静态页面大约需要40-70ms，而新文档只需要大约150ms的两倍。虽然在实践中150毫秒并不能满足我的需求，但在大规模的环境中，我确信我的文件夹中的glob函数只会让系统陷入困境。

对于任何想知道的人，这就是我做的事情

代码

层次结构如下所示

|app
  |controllers
    |-document.js
  |views
    |-document.jade
|public
  |docs
    |
    |//folders
    |

documents.js

var express = require('express');
var router = express.Router();
var glob = require('glob');

module.exports = function(app) {
    app.use('/', router);
};

router.get('/documents*', function serveDocsHome(req, res) {
    //this removes %20 from the requested url to match files with spaces
    req.originalUrl = req.originalUrl.replace('%20', ' ');

    //fun string stuff to make links work
    var dir = '/docs' + req.originalUrl.substr(10);
    var url = req.originalUrl + '/';

    //for moving up a directory
    var goUp = false;
    var folderName = 'Home';
    if (req.originalUrl != '/documents') {
        var end = req.originalUrl.lastIndexOf('/');
        folderName = req.originalUrl.substr(end + 1);
        goUp = true;
    }

    //get all the folders
    var folders = glob.sync('*/', {
        cwd : 'public' + dir
    });
    for (var i = 0; i < folders.length; i++) {
        folders[i] = folders[i].substr(0, folders[i].length - 1);
    }

    //get all the files
    var files = glob.sync('*', {
        cwd : 'public' + dir,
        nodir : true
    });

    //attach the files and folders
    res.locals.folders = folders;
    res.locals.files = files;
    res.locals.loc = dir + '/';
    res.locals.goUp = goUp;
    res.locals.url = url;
    res.locals.folderName = folderName;

    //render the doc
    res.render('documents', {
        title : 'Documents',
    });
});

documents.jade

extends layout

append css
    link(rel='stylesheet', href='/css/docs.css')

append js
    script(src='/js/docs.js')

block content
    .jumbotron(style='background: url(/img/docs.jpg); background-position: center 20%; background-repeat: no-repeat; background-size: cover;')
        .container
            h1= title
            p View minutes, policies, and guiding papers of the [name]

    .container#docs
        .row
            .col-xs-12.col-sm-3.sidebar.sidebar-wrap
                h3= folderName
                ul.no-style.jumplist
                    hr
                    if goUp
                        li#go-up: a.message(href='./') #[img(src='/img/icons/folderOpen.png')] Up One Folder
                    each val in folders
                        li: a(href='#{url + val}'): #[img(src='/img/icons/folder.png')] #{val}

            .col-xs-12.col-sm-9
                h3 Files
                ul.no-style
                    if files.length != 0
                        each val in files
                            li: a(href='#{loc + val}')= val
                    else 
                        li.message No Files Here

这是页面的一部分

网站文件和文件夹浏览器：我应该使用静态还是Ajax？

1。使用Ajax

2。去＆＃39;静态＆＃39;

目前

1 个答案:

代码